首頁 > web前端 > js教程 > 如何防止子錨點擊觸發父點擊事件?

如何防止子錨點擊觸發父點擊事件?

Linda Hamilton
發布: 2024-12-14 18:39:09
原創
696 人瀏覽過

How to Prevent Child Anchor Clicks from Triggering Parent Click Events?

防止子錨點點擊事件觸發父級點擊事件

如程式碼所示,當在父div 中點擊子錨點元素時對於onclick 事件,這兩個事件都會觸發。要解決此問題並阻止父級點擊事件執行,您有兩個選擇:

選項1:檢查事件來源

透過檢查jQuery 傳遞的eventargs 對象,您可以確定啟動點擊的元素:

$("#clickable").click(function(e) {
    if($(e.target).is("div")) {
        window.location = url;
        return true;
    }
});
登入後複製

如果傳送者元素不是div 本身,則div的onclick 處理程序不會被觸發。

選項2:停止事件冒泡

或者,您可以使用stopPropagation( ) 子錨點上的方法:

$("#clickable a").click(function(e) {
    // Custom anchor handler
    e.stopPropagation();
});
登入後複製

此方法可防止事件傳播到父級div,確保僅觸發錨點點擊事件。

以上是如何防止子錨點擊觸發父點擊事件?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板