關閉一個div，然後點擊該區域外的任何地方

我想創建一個jQuery導航欄。所以當我點擊div main，一個新的div會滑落，我想添加一個選項來關閉窗口，如果我們點擊新打開的窗口以外的任何地方。這是我用過的代碼，但它不起作用。關閉一個div，然後點擊該區域外的任何地方

剛剛打開的div在我點擊其他任何地方時沒有關閉。

var $s = $("#main");  
$(document).ready(function() 
{ 
    $(document.body).click(function() 
    { 
    $('ul.the_menu').slideToggle('medium'); 
    if (!$s.has(this).length) 
    { 
     $s.hide(); 
    }  
}); 
});

來源

2012-03-16 Sam

你能描述** **什麼是不工作？ – gideon 2012-03-16 04:56:24

當我點擊它外面的任何地方時，新打開的div彈出關閉。 – Sam 2012-03-16 04:57:36

提問時請使用更好的語法和拼寫。 – gideon 2012-03-16 05:00:07

你可以通過附加一個事件到頁面的「body」來做到這一點是最簡單的方法。

$("body").click(function() { 
     .... 
    });

您正在嘗試使用JavaScript DOM參考，在這裏你需要使用jQuery選擇適用的jQuery事件。

來源

2012-03-16 05:01:06 Gats

我看到這個問題每週至少問一次。我通常會逃避這一點，但這取決於你的邏輯和標記。

$menu.focusout(function(){ 
    $(this).slideUp(); 
})

來源

2012-03-16 05:02:28 elclanrs

var $_theDiv = $('#the_div') 

$_theDiv.click(function(e){ 
    e.stopPropagation(); 
}); 
// stops the event from bubbling up to the body. 

$(document).click(function(){ $_theDiv.hide(); }); 
//Now any time a click event bubbles to the top of the document, you know it wasn't #theDiv

我要去一個基本的例子，去得到的總體思路。我們展示#theDiv。現在，如果我們點擊任何地方而不是#theDiv，我們希望它消失。所以我們在事件對象上使用stopPropagation。通常，當您點擊時，點擊也會上升到父級和該父級的父級，並且一直持續到您點擊文檔。這被稱爲「事件冒泡」。由於我們停止了冒泡，因此我們知道點擊是否到達文檔（HTML標籤），因爲e.stopPagagation阻止了它，所以它不可能來自#theDiv。鼓泡非常有用，所以只能對沒有子元素（不是容器）的元素使用stopPropagation。像鏈接，圖像和按鈕。

來源

2012-03-16 05:05:24

你的意思是這樣的：


if(!$(event.target).is('#main')) { 
    // your code to close the div 
}

來源

2012-03-16 05:29:24

關閉一個div，然後點擊該區域外的任何地方

回答

相關問題