Question

我有一块JQuery在表中创建一行，在其中一个单元格中有一个由类包围的X.当动态创建然后单击时，单击侦听器不会触发。这是代码。

$('#add').click(function() {
   $( '#table' ).append('<td class="x">X</td></tr>');
});
$('.x').click(function() {
  alert('Fired');
});

Answer 1

由于注册事件处理程序时<td>元素尚不存在，因此您必须使用live()或delegate()来处理稍后触发的处理程序：

$(".x").live("click", function() {
    alert("Fired");
});

Answer 2

$(".x").live("click", function()
{
   alert("Fired");
});

直播将事件添加到DOM中稍后添加的任何内容以及当前的内容。

Answer 3

而不是

$('.x').click(function() {
  alert('Fired');
});

更改为

$('.x').live('click', function() {
  alert('Fired');
});

它将click函数绑定到任何带有类x

的已创建元素

Answer 4

您需要将.live函数用于动态生成的内容。

所以替换

$('.x').click(function() {

与

$('.x').live('click',function() {

Answer 5

您首先要创建所有.x元素的侦听器（其中可能为零），然后再添加新的.x元素。

有两种解决方案：一种是使用jQuery live，另一种是重写代码：

var xClickHandler = function() {
    alert('Fired');
};
$('#add').click(function() {
    $('#table').append(
        $('<td class="x">X</td></tr>').click(xClickHandler);
    );
});

Answer 6

使用live代替click：

$('.x').live("click", function() {
    alert('Fired');
});

Answer 7

你要附加到表格的html有一个拼写错误，你错过了beggining tr标签：

$('#add').click(function() {
   $( '#table' ).append('<tr><td class="x">X</td></tr>');
});
$('.x').click(function() {
  alert('Fired');
});

Answer 8

我认为你需要使用live方法。 http://api.jquery.com/live/

$('.x').live('click', function() {
  // Live handler called.
});

Jquery动态创建链接

8 个答案: