ibeautiful
2019-10-06 15:11:33
我有一個復選框,我想對click事件執行一些Ajax操作,但是該復選框也位于容器中,它具有自己的單擊行為,當單擊該復選框時,我不想運行該行為。此示例說明了我要執行的操作:$(document).ready(function() { $('#container').addClass('hidden'); $('#header').click(function() { if ($('#container').hasClass('hidden')) { $('#container').removeClass('hidden'); } else { $('#container').addClass('hidden'); } }); $('#header input[type=checkbox]').click(function(event) { // Do something });});#container.hidden #body { display: none;}<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script><div id="container"> <div id="header"> <h1>Title</h1> <input type="checkbox" name="test" /> </div> <div id="body"> <p>Some content</p> </div></div>但是,我不知道如何在不導致默認點擊行為(復選框變為選中/取消選中)的情況下停止事件冒泡。以下兩項都停止了事件冒泡,但也沒有更改復選框狀態:event.preventDefault();return false;
4 回答

開心每一天1111
TA貢獻1836條經驗 獲得超13個贊
更換
event.preventDefault();
return false;
與
event.stopPropagation();
event.stopPropagation()
停止將事件冒泡到父元素,從而防止任何父處理程序收到該事件的通知。
event.preventDefault()
阻止瀏覽器執行默認操作。使用isDefaultPrevented方法可以知道是否曾經(在該事件對象上)調用過此方法。

飲歌長嘯
TA貢獻1951條經驗 獲得超3個贊
別忘了IE:
if (event.stopPropagation) { // standard
event.stopPropagation();
} else { // IE6-8
event.cancelBubble = true;
}

至尊寶的傳說
TA貢獻1789條經驗 獲得超10個贊
使用jQuery時,您無需單獨調用stop函數。
您可以只返回false事件處理程序
這將停止事件并取消冒泡。
另請參閱event.preventDefault()與return false
從jQuery文檔中:
因此,這些處理程序可能會通過調用event.stopPropagation()或return 阻止委托處理程序觸發false。
添加回答
舉報
0/150
提交
取消