jQuery .on（）不能與jquery-ujs一起使用

Question

所以我有一個通過jquery-ujs呈現視圖的rails應用程序。 （數據用遙控器的URL，然後用喜歡的東西的js.erb文件加載：

$('#whatever').html('<%= j render("form") %>'); 

我主要的JS文件，我的事件處理程序，如下所示：

$('.action').on('click', function() { 
    console.log("clicked"); 
}); 

但上（）行爲不會附加到由jquery-ujs插入的新元素，我可以進入控制檯並粘貼上面的代碼，一切都很好（一旦元素已經存在），但直接在ujs之後觸發，沒有運氣。這是一個錯誤還是我做錯了什麼？

這是用jQuery 1.9.1和Rails 3 .2.13 btw。

Answer 1

您需要將on綁定到像document這樣的父級。現在，您直接綁定到.action元素，這與使用$('.action').click()基本相同。因爲您稍後將元素添加到DOM，所以您需要將處理程序委託給插入元素之前已存在的某個元素。您可以提供選擇器作爲.on事件的第二個參數，以將其綁定到.action。

查看'Direct and delegated events'部分in jQuery's API documentation for .on。

這應該工作：

$(document).on('click', '.action', function() { 
    console.log('Clicked!'); 
}); 

Answer 2

由於#whatever似乎是靜態的（始終存在），你可以委託處理它..

$('#whatever').on('click','.action', function(e){ 
    console.log("clicked"); 
}); 

（假設.action元素加入#whatever元素內）

---

請參閱http://api.jquery.com/on/#direct-and-delegated-events瞭解更多關於授權事件