模糊不起作用后单击"

Question

我正在编辑文本框，然后直接单击按钮，并且不会单击按钮的事件。

有许多类似的帖子建议使用onmousedown而不是onclick，但我认为这不是解决方案。当我在文本输入的模糊事件上做一些工作，并在单击按钮上进行一些验证。onmousedown将在Blur之前调用，这意味着在Blur之后我无法进行验证。我只想在Blur 之后单击。有什么方法可以做吗？

html

<input type="text" onblur="txtblr()">
<input type="button" onclick="btnclk()" value="button">

javascript

function txtblr(){
if(confirm('relly?')) {
    console.log('blur');
  }
 else {
    console.log('dont blur');
  }
}
function btnclk(){
    console.log('click');
}

小提琴

Answer 1

我只想在模糊之后拨打点击。

你是。

function txtblr() {
  console.log('blur');
}
function btnclk() {
  console.log('click');
}

<input type="text" onblur="txtblr()">
<input type="button" onclick="btnclk()" value="button">

问题：alert()阻止UI

当您在onblur上有alert()（或confirm()）时，按钮的onclick事件不会触发。alert() S阻止您的UI在页面上进行其他任何事件。从本质上讲，当文本框具有焦点时，单击按钮时会发生什么：

• TextBox的onblur被触发，该CC_10立即触发alert()。
• alert()阻止UI线程 - 将鼠标移至 警报的确定按钮；或者你没有。无论如何，由于alert()。

解决方案：不要阻止UI

一般而言，阻止眉毛执行其他任何操作是一个坏主意。这会创造出糟糕的用户体验。以下方法告诉您如何避免它。

alert()使用setTimeout()

一个解决方法是使用setTimeout()进行alert()，以确保它不会阻止页面。但是，这不会等待用户确认alert()以移至按钮的onclick事件。

function txtblr() {
  setTimeout(function() { 
    alert('blur');
  }, 100);
}
function btnclk() {
  console.log('click');
}

<input type="text" onblur="txtblr()">
<input type="button" onclick="btnclk()" value="button">

最好使用其他方法获取用户反馈

另一个更可取的解决方案将不依赖alert() s和confirm() s来获取用户的输入并实现非阻止模式 - 您会找到大量的库。

Answer 2

我不积极，我会理解您的问题。听起来您想要的是调用单击处理程序中使用的功能（， btnclk()）当blur事件在<input />元素上注册时（text -Type <input />，也就是说）。如果是这样，请尝试以下类似的内容：

````````我不是积极的，我理解您的问题。听起来您想要的是调用单击处理程序中使用的功能（， btnclk()）当blur事件在<input />元素上注册时（text -Type <input />）。如果是这样，请尝试以下类似的内容：

window.addEventListener('DOMContentLoaded', function() {
  document
    .querySelector('input[type="text"]')
    .addEventListener('blur', btnclk);
});

Answer 3

function txtblr(){
if(confirm('relly?')) {
    console.log('blur');
  }
 else {
    console.log('dont blur');
  }
}
function btnclk(){
    txtblr();
    console.log('click');
}

<input type="text" onblur="txtblr()">
<input type="button" onclick="btnclk()" value="button">

我认为这是您的期望。

Answer 4

您可以在模糊中调用单击功能，如下所示...因此，一旦文本框模糊，您的模糊操作就完成了，并且点击操作是通过调用点击函数来完成的。

javascript

function txtblr(){
 alert('blur');
 btnclk();
}
function btnclk(){
 alert('click');
}