如何在更換註冊事件的區域時防止丟失事件

Question

我有一個由插件創建的點擊事件，加載$ .ajax後只替換（更新）包含click事件的區域，事件將丟失。

<span ref='B'><span ref='A'></span></span> 
//click event is on A, but I replaced the html inside of B to <span ref='A'></span>; 
its update, so the replaced html are the same. 

我看了很多相關的問題，我找到了解決辦法是

.live() // will not work 
.delegate(), // work 
.on(), // work 

的解決方案是我B上的事件綁定的，而不是像B.on('click', A, function(){}) ....

然而，我的結構非常難以改變，我更希望找到一種解決方案，可以在替換或替代時防止丟失事件。

請指教，非常感謝。

---

通過使用分離解決（）

Answer 1

由於DOM元素的上下文中存在事件綁定，當你開始移除或替換DOM元素，需要一些機制來重新建立所述事件綁定。

一個好方法是通過父元素使用委託（如您所述 - B.on('click', A, function(){})....）。

另一種替代方法是在所涉及的DOM元素被移除或替換的地方始終重新建立綁定（所以在您的場景中，這聽起來像是必須位於Ajax回調/完成處理程序中）但是這通常是一種較差的方法，並且比委託方法更不優雅。

Answer 2

如果您擔心將on事件應用於頁面上的某個元素，然後，我會建議將活動綁定到document。

$(document).on('click', '#id-of-a', function(){ 

}); 

有關這方面的更多信息，請閱讀blog post。

Answer 3

我找到了解決方案。這可以使用.detach（）！測試。