3 回答

TA貢獻1776條經驗 獲得超12個贊

TA貢獻1806條經驗 獲得超5個贊
要理解為什么在向窗口/文檔/(無論什么父元素)添加單擊事件處理程序時看到菜單立即關閉,有必要從事件捕獲和冒泡的討論開始。順序是捕獲 -> 單擊捕獲 -> 傳播。您單擊一個元素,它首先在窗口上被捕獲,然后一直沿著 DOM 向下到達最具體的 DOM 元素。然后它會一路“冒泡”備份觸發事件處理程序。
在您的場景中發生的情況是,菜單上的單擊事件不僅在該元素上觸發處理程序,而且還在每個父元素上觸發處理程序。一種可能的解決方案是event.stopPropagation()
向菜單添加單擊事件處理程序,以便單擊事件不會冒泡到您附加“關閉菜單”功能的任何父 DOM 元素。

TA貢獻2021條經驗 獲得超8個贊
https://jsfiddle.net/f21vnq5s/1/
您應該首先設置菜單的高度,然后在文檔中檢查單擊是否在標題中
它應該與 jquery 一起工作
$(document).mouseup(function (e)
{
var searchcontainer = $(".header");
if (!searchcontainer.is(e.target) // if the target of the click isn't the container...
&& searchcontainer.has(e.target).length === 0) // ... nor a descendant of the container
{
nav.style.visibility = "";
}
});
- 3 回答
- 0 關注
- 160 瀏覽
添加回答
舉報