動態生成的輸入不工作

我想使用jQuery和html製作動態表。基本上，它所做的是，從輸入的文本中追加一個新行，其中包含一個單元格的文本和另一個單元格中的刪除按鈕。但我的問題是，輸入的點擊事件沒有觸發。這裏有添加和刪除行動態生成的輸入不工作

//Remove Row  
$('.remove-row').click(function() { 
    alert('Works!'); 
}); 

//Add Row 
$('.add-other-sources').click(function() { 
    var $text=$(this).parent().parent().find('.other-sources-input'); 
    var $table=$(this).parent().parent().parent().find('.other-sources-table') 
    $('<tr><td>'+$text.val()+'</td><td><input type="button" class="remove-row" value="x"/></td></tr>').fadeIn('slow').appendTo($table); 
    $text.val(""); 
});

從我能想出的網絡檢查的腳本，輸入的標籤顯示了這樣<input type="button" class="remove-row" value="x">。這與刪除行事件不起作用有什麼關係？

有沒有人有任何想法如何解決這個問題？在此先感謝

來源

2013-05-13 Joao Batista

您需要委託的事件處理程序：

//Remove Row  
$('table').on("click", ".remove-row", function() { 
    alert('Works!'); 
});

的原因是正常的處理程序僅連接到已有的元素。使用委託處理程序時，點擊會附加到父元素，但只有源代碼從您指定的選擇器冒泡時纔會執行此功能。

來源

2013-05-13 22:34:23 Kenneth

工程就像一個魅力。謝謝！ – 2013-05-13 22:50:48

如果您想將事件附加到動態創建的元素，則需要委派事件。

$(staticContainer).on('click', '.remove-row',function() {

StatucContainer可以是始終存在於HTML中的任何容器。越接近有問題的元素，性能越好。

來源

2013-05-13 22:34:33

動態生成的輸入不工作

回答

相關問題