jQuery .blur＆.focus问题与CSS＆JS下拉菜单

我想做一个CSS &基于JS的下拉菜单。jQuery .blur＆.focus问题与CSS＆JS下拉菜单

这个例子适用于所有浏览器：

http://jsfiddle.net/bqQqN/1/

然而，我想，以确保项目失去焦点，并自动点击其他的东西<body>后关闭。我试图实现与下面的代码：

http://jsfiddle.net/bqQqN/2/

现在，.blur功能不工作在所有的浏览器，但是当我点击有插入了和没有其他文本两次在元素，它会关闭并再次打开，而不是关闭。

我迷失在这里。我当然想保留.blur函数，但是我想确保正常行为能够保持。

任何帮助非常感谢！

来源

2011-10-28 Martijn van Turnhout

要再次隐藏它，请将点击侦听器绑定到文档，然后您可以检查您点击的内容是否在您的下拉列表中，如果是，则返回false;如果不是，则隐藏。实际上，这意味着如果您在下拉列表中单击除链接以外的其他任何内容，它都会隐藏它。

var $dropdown = $(".dropdown > dd > ul"), 
    $drop_link = $(".dropdown > dt > a"); 

$drop_link.click(function(e) { 
    $dropdown.toggle(); 
    e.preventDefault(); 
}); 

// Bind the click to everything 
$(document).mouseup(function(e) { 
    // If the dropdown is visible 
    // and the thing we've clicked is not a descendent of the dropdown 
    if ($dropdown.is(":visible") && $(e.target).parents('.dropdown').length == 0) { 
     $dropdown.hide(); 
    } 
});

我也更新了jsFiddle

来源

2011-10-28 07:44:09 Wil

谢谢，它几乎解决了。我现在有下面的问题。看看这个jsFiddle：http://jsfiddle.net/NcNHf/2/。当我点击菜单时，我想让其他菜单自动关闭。我怎么做到这一点_ –

我进一步更新您的jsFiddle，使其他打开的菜单中会隐藏...我也感动顶部菜单项是并排侧，更明显的是打开的菜单正在关闭。

来源

2012-04-18 14:06:33 ShatyUT

jQuery .blur＆.focus问题与CSS＆JS下拉菜单

回答

相关问题