使用jquery刪除/添加類到正文使用jquery

我陷入了問題我有一個div，我想在按鈕上顯示並隱藏點擊任何其他地方。但是，在div類的內部點擊也會隱藏起來，這是我不想要的。使用jquery刪除/添加類到正文使用jquery

<body> 
<ul> 
    <li> test</li> 
<li>test</li> 
<li>test</li> 
<li>test</li> 
<li> <button>click</button> 
<div id="test" class="hidden"> 
    <ul> 
     <li> test</li> 
     <li>test</li> 
     <li>test</li> 
     <li>test</li> 
    </ul> 
</div> 
</li> 
</ul> 
</body> 

<script> 
$('botton').click(function(){ 
    $('#test').removeClass('hidden'); 
}); 
$('body').click(function(){ 
    $('#test').addClass('hidden'); 
}); 

</script>

如何我可以禁用在專區內點擊添加hidden類。

來源

2015-09-12 Muhammad Nasir

爲了避免增加內點擊時隱藏類div，你可以在添加隱藏的類之前檢查點擊事件是否來自div內的元素。 jQuery.closest（）可用於此目的。

$('body').click(function(event){ 
if ($(event.target).closest('#test').length == 0) 
    $('#test').addClass('hidden'); 
});

正如MysterX指出的，$（'botton'）應該先固定爲$（'button'）。

來源

2015-09-12 19:21:08

使用stopImmediatePropagation：'保持處理程序的其餘部分不被執行，並防止事件冒泡DOM樹。 link

$('button').click(function(e){ 
    $('#test').removeClass('hidden'); 
    e.stopImmediatePropagation(); 
}); 

$('body').click(function(e){ 
    $('#test').addClass('hidden'); 
    e.stopImmediatePropagation(); 
});

來源

2015-09-12 18:41:17 Data

這不是一個好的解決方案，例如，如果點擊跟蹤到數據庫 – MysterX

@MysterX - 你指的是哪個數據庫？ – Data

我不是想回到任何數據庫，我說過，如果你使用許多不同的用戶活動跟蹤器之一，這個點擊將不會跟蹤到analitycs儀表板 – MysterX

第一：你有代替bottonbutton

二：你的問題的解決方案是檢查被點擊了哪個元素：

$('button').click(function(){ 
    $('#test').removeClass('hidden'); 
}); 
$('body').click(function(event){ 
    if(!$(event.target).is('button')){ 
     $('#test').addClass('hidden'); 
    } 
});

來源

2015-09-12 18:44:40 MysterX

回覆於ya upvote。 – Data

使用jquery刪除/添加類到正文使用jquery

回答

相關問題