事件監聽器中的jQuery綁定事件

我有一個綁定到它的單擊事件監聽器的鏈接。單擊它將單擊事件偵聽器附加到文檔，這次該事件是命名空間的，以便我可以輕鬆地將其刪除。在附加第二個事件後，它立即被解僱。爲什麼會發生這種情況？我最好的猜測是，當新事件附加到文檔中時，事件仍然冒泡了dom樹。因爲這會觸發兩個事件。請參閱以下JSFiddle。事件監聽器中的jQuery綁定事件

HTML

<a href="#" id="example">Click Me</a>

的Javascript

$('#example').on('click', function(e) { 
    $(document).on('click.example', function(e) { 
     alert('example event triggered'); 
    }); 
});

我所要完成的是，在點擊一個按鈕，我插入一個DOM元素。當它插入時，我想附加一個事件監聽器到觸發時檢查事件目標文件，以檢測是否有任何點擊事件發生在插入的元素之外。如果目標在它內部，它就不應該做任何事情。如果目標位於元素之外的任何位置，則它應該隱藏該元素。

來源

2014-11-05 aronkerr

希望你有照顧很奇怪，在我看來是錯誤的 – noobed 2014-11-05 09:07:45

在給出的例子中你是對的，它會這樣做。在我的實際代碼中，有一個檢查正在運行，以確定是否已經有一個事件監聽器，如果它沒有重新連接。點擊創建元素外部的事件然後解除綁定。 – aronkerr 2014-11-05 09:15:15

你爲什麼不在「init方法」中綁定事件？這樣它只會綁定一次 - 而不是讓你的生活在運行時檢查一些東西有點困難 – noobed 2014-11-05 09:17:28

這是因爲，事件傳播的

$('#example').on('click', function(e) { 
 
    $(document).on('click.example', function(e) { 
 
    alert('example event triggered'); 
 
    }); 
 
    e.stopPropagation(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<a href="#" id="example">Click Me</a>

正在註冊的處理程序時的事件仍然在anchor元件，而該事件綁定到文檔對象，它是一個當前元素的祖先。所以現在當事件最終傳播並達到document對象時，它會發現綁定到它的點擊處理程序並觸發它。

注意：您應該不只是在每一次點擊每點擊＃示例，你會綁定一個「$（文件）。在」這是莫名其妙地添加新的處理器...它

來源

2014-11-05 09:04:23

事件監聽器中的jQuery綁定事件

回答

相關問題