setTimeout 仅在导致它的事件的第一次不工作

Question

在下面的代码中，我想在提到的 <textarea> 和 <input> 模糊 500 毫秒后设置 var hasFocus=False;。这段代码第一次不用等500ms，立即转hasFocus=False。之后，它按预期工作。
我无法理解为什么它只是第一次运行不如预期！

$(function(){
    var hasFocus=false;

    $("textarea[name='question1'], input[name^=q1_option]").blur(function(event){
        setTimeout(function(){
            hasFocus=false;
        },500);
    }).focus(function(){
       hasFocus=true;
    });

    $(document).on('click',function(e){
        console.log("focus :" +hasFocus);
        if(hasFocus)
        {
           alert("Working!!"); //Now this does not come up for the first time!
        } 
    })
});

Answer 1

那是因为您的 console.log 在触发超时模糊事件之前执行，因此控制台显示之前的值。将 console.log("focus :" +hasFocus); 移到 blur 和 focus 函数中，看看是否一切正常。

演示 - Fiddle

Answer 2

        setTimeout(function(){
        hasFocus=false;
    },500, function() {hasFocus=true;});

只需添加：function() {hasFocus=true;} 到 setTimeout 函数的末尾。或者创建一个将 hasFocus 变量设置为 true 的函数，并在 setTimeout 函数完成时调用此函数。

您可以在此处阅读有关 setTimeout 函数的更多信息：http://www.sitepoint.com/jquery-settimeout-function-examples/

编辑：哦，如果这个方法行不通，那么 Nikolay 是对的！ :)

Answer 3

好吧，经过大量的努力，我想到了这个。它不是我的确切代码，而是一个演示，它完全按照我想要的方式工作：

 $(function(){
    var hasFocus=false;

    $("textarea[name='question1'], input[name^=q1_option]").blur(function(event){
        setTimeout(function(){
            hasFocus=false;
        },500);
    }).focus(function(){
       setTimeout(function(){ //just initiated focus event after blur event
              hasFocus=true; //just initiated focus event after blur event
          },510); //just initiated focus event after blur event
    });

    $(document).on('click',function(e){
        console.log("focus :" +hasFocus);
        if(hasFocus)
        {
           alert("Working!!"); //Now this does not come up for the first time!
        } 
    })
});

setTimeout 仅在导致它的事件的第一次不工作

setTimeout not working only for the first time of the event causing it

javascript

jquery

blur

settimeout