Jquery链接单击不起作用

Question

each(data, function(i, elem) {
    var url = image_path + elem["c_no"] + "$" + elem["p_date"] + "$" + elem["time_slot"] + "$" + elem["d_name"] + ".jpg";
    var new_row = '<td  align="middle">' + elem["p_date"] + '</td>';
    new_row += '<td  align="middle">' + elem["d_name"] + '</td>';
    new_row += '<td  align="middle">' + '<a href="#" class="x"> AAAAA </a>' + '</td>';
    var appendRow = '<tr>' + new_row + '</tr>';
    $('#pres tr:last').after(appendRow);
});


$('table#pres td a.x').click(function() {
    console.log("ITWORKS");
});

我尝试在上面的代码段上动态显示网页上的一些链接。它工作正常。但是我需要在点击链接后做一些事情。

Answer 1

使用on()：

$('#pres').on("click", "td a.x", function() {
   console.log("ITWORKS");
});

这将为所有现有和未来创建的匹配元素附加click事件处理程序。

Answer 2

您必须为动态添加的元素执行Event delegation。

 $('table#pres').on('click','td a.x',function() {

    console.log("ITWORKS");

});