我有一个搜索建议框,当搜索文本框失去焦点时我会隐藏它。这很好用,除了当我单击其中一个建议时,该建议的单击事件不会触发。
searchText.focusout(function () { $("#search-suggestions").hide(); });
我也试过:
searchText.focusout(function () { $("#search-suggestions").css("visibility", "hidden"); });
我尝试注释掉 hide on unfocus 代码,然后点击事件工作正常。
(基本上,模糊事件发生在可以注册建议的点击之前,这样当 clicm 注册时我试图点击的元素不在屏幕上)
点击事件代码如下:
//ajax加载后调用
$("#search-suggestions").find("a").click(function () { alert("hi"); })
我也试过在服务器上渲染它,但也失败了:
<a href="javascript: alert('hi')">Search Suggestion</a>
如果有人有任何建议,我将不胜感激。谢谢!
最佳答案
你可以尝试定义这样的东西:
//this goes where you first binding focusout handler
searchText.focusout(onFocusOut);
//this is a usual function
function onFocusOut() {
$("#search-suggestions").hide();
}
//this could be defined after you draw the search-suggestions control
$("#search-suggestions").hover(function() {
//this is hover in handler; unbind focusout from searchText
//something like that:
$("#searchText").unbind('focusout', onFocusOut)
}, function() {
//this is hover out handler; bind focusout to searchText
//something like that:
$("#searchText").bind('focusout', onFocusOut)
});
您还可以使用 live
( http://api.jquery.com/live/ ) 为 #search-suggestions
定义悬停处理程序,具体取决于您的具体需要。
这将使您的搜索建议在单击时保持可见。在点击处理程序中,您可以隐藏它们。
关于javascript - JS jQuery 在 unfocus 上隐藏元素会阻止其他事件被触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7080239/