我正在编写一个简单的 jQuery 插件，它会在文本框获得焦点时动态地将一个 div 放置在该文本框下方。我已经能够在所有浏览器中获得正确的位置。
我还必须在文本框的 focus 和 blur 事件上附加两个事件处理程序。它工作正常，但问题是即使我们单击它，放置在文本框下方的 div 也会关闭。现在它为什么会这样发生是有道理的，这是因为文本框失去了焦点，但有什么办法可以阻止它发生吗？
我尝试将其附加到模糊事件处理程序 -
if($(mainElem).is(":focus")) return;
其中 mainElem 是显示在文本框下方的 div。
这是一个jsFiddle to illustrate问题。
最佳答案
如果您想在显示的 div 中放置“可点击”元素，您将无法使用 blur 事件。解决此问题的一种方法是将您的事件监听器绑定(bind)到更全局的元素，例如 document，然后过滤掉目标。
这是一个代码示例:
$(document).on('click', function (e) {
var targetEl = e.target,
parent = $(e.target).parents()[0];
if (relElem[0] === targetEl || self[0] === targetEl || self[0] === parent) {
$(mainElem).show();
} else {
$(mainElem).hide();
}
});
这是对您的 fiddle 的更新:http://jsfiddle.net/9YHKW/6/
关于javascript - 单击时停止元素消失，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18197305/