觸發焦點事件將觸發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>

希望這有助於！ :)