javascript - 防止blur()运行

Question

我有一个引导弹出窗口，它在输入的焦点上变为事件状态。弹出窗口中包含一个用于执行 ajax 请求的按钮。

我有一个 blur 函数，如果用户单击远离输入的位置，该函数会关闭弹出窗口:

$(document).on('blur','.open-popover',function(){        
    $(".popover").attr("style","");
    //and do other things too  
});

如果用户按下弹出窗口中的按钮，我会尝试阻止上面的 blur 函数运行:

$(document).on('click','button',function(){
    //prevent the blur actions and 
    //do ajax stuff                                   
});

Answer 1

你看过stopImmediatePropagation吗？ ？如果使用 jQuery，则事件处理程序将按照它们绑定(bind)的顺序触发。只需在模糊之前绑定(bind)点击，然后在点击事件中运行 stopImmediatePropagation 即可。

// bind click event first
$(document).on('click','button',function(event){
    // keeps the rest of the handlers from being executed and prevents the event from bubbling up the DOM tree.
    event.stopImmediatePropagation();                            
});

// then attach blur
$(document).on('blur','.open-popover',function(){        
    $(".popover").attr("style","");
    //and do other things too  
});