触发焦点事件将触发blur事件（不使用的警报和浏览器控制台）

Question

jsfiddle link

<input id = "focus-ipt" type = "text" value = "nothing" />

var $focusIpt = document.querySelector("#focus-ipt"); 
$focusIpt.addEventListener("blur", function (e) { 
    $focusIpt.value = "blured!"; 
}); 
setTimeout(function() { 
    $focusIpt.focus(); 
    }, 1000); 

我只是触发焦点事件，但焦点后的模糊触发的事件; 我搜索了很长时间，关闭控制台，使用setTimeout，但是，解决不了;我真的不知道这是怎么发生的，任何人都可以帮助我？

Answer 1

这实际上是而不是的情况; focus()不会自动触发blur()。

由于您正在与DOM进行交互，因此blur()正在触发。通过点击小提琴中的某个按钮（如Run或Tidy），#focus-ipt元素不再处于活动状态 - 您点击的按钮是。

如果您只是等待超时而不做任何事情，则不会发生blur()事件。只要你点击输入，blur()将发生。

这可以看出，在下面的例子：

var $focusIpt = document.querySelector("#focus-ipt"); 
 
$focusIpt.addEventListener("blur", function(e) { 
 
    $focusIpt.value = "Blurred!"; 
 
}); 
 
setTimeout(function() { 
 
    $focusIpt.focus(); 
 
}, 1000);

<input id="focus-ipt" type="text" id="myText" value="Sample Text"> 
 
<button type="button">Click me to lose focus</button>

希望这有助于！ :)