jquery事件不識別js添加的html組件？

Question

我正在使用js將表單元素添加到html文檔中。例如，我將一整個<form>添加到表格單元格中。例如：

<form class="add-comment"><input type="submit" /></form> 

我試着用js調用基於元素新創建的窗體中，但什麼也沒有發生的事件。我應該得到一個警告框。我在做什麼錯誤？

$('.add-comment').submit(function() { 
    alert('form submitted!'); 
}); 

謝謝。 希望我解釋得很好。

Answer 1

您是否在註冊提交事件處理程序後添加元素？除非使用實時方法添加事件，否則您需要在每個新元素之後註冊事件。

$('.add-comment').live('submit', function() { 
    alert('form submitted!'); 
}); 

這會爲所有選定的元素添加事件，即使它們將來被添加。

http://api.jquery.com/live/

Answer 2

新創建的元素沒有連接到他們的任何事件處理程序。您必須選擇它們並在添加事件處理程序後添加事件處理程序（例如，$('.add-comment', newparent).submit(submitfunction)）。

您通常可以使用.live(eventname, function)爲現有的和未來創建的元素添加事件處理程序。但是，由於這些事件是如何在瀏覽器中實現的，所以不能在jQuery 1.3中使用.live('submit', ...)（技術上，它們不會「冒泡」）。

jQuery的1.4不支持live對submit（通過一個非常醜陋的黑客）。

Answer 3

Kyle是對的，您應該使用實時事件將事件添加到當前和未來的DOM元素。然而，作爲替代，你可以在創建表單元素添加事件：

（jQuery的1.4樣式）對此，如果你不使用jQuery 1.4

$('<form>', { 
    id: 'myFormID', 
    name: 'myFormName' 
}).submit(function(){ alert('form submitted'); }) 
.appendTo(myDiv); 

Answer 4

我寫了一個rather long blog post 。您必須連接新添加的元素，因爲當頁面加載時它們不在那裏。它應該讓你深入瞭解.live()方法正在發生的事情。

Answer 5

當然，將事件添加到元素是最常見的做法。嘗試瞭解發佈/訂閱風格的事件處理，這可以取代使用實時插件。