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下拉菜單

回答

相關問題