Question

当我点击id =“arrival”的链接时，我调用了一个AJAX函数，它通过arriInbox.php查询mysql数据库。 arriInbox.php返回一个数据数组。我填写了表#inboxdashboard（在HTML部分的同一文档中创建），其中tr创建了dinamycally。这就是我创建表格的方式：

<table id="inboxdashboard" style="display:none">
<tr id="myheadermob">
<td id="firstheadermob">Object</td>
<td id="secondheadermob">From</td>
<td id="thirdheadermob">Date</td>
</tr>
</table>


$('#arriving').click(function()
{   
     var str ="";
        $.ajax
            ({
                type: "POST",
                url: "arrivedInbox.php",
                dataType:"json", 
                success: function(data)
                {
                    var arrayLength = data.length;
                    for (var i = 0; i < arrayLength; i=i+6) 
                    {
                        str ="";
                        str+="<tr class='trmessage' id=" + data[i+5] + ">";
                        str+="<td id='firstcolumnmob'>"+(data[i+3])+"</td>";
                        str+="<td id='secondcolumnmob'>"+(data[i+2])+"</td>";
                        str+="<td id='thirdcolumnmob'>"+(data[i+4])+"</td>";
                        str+="</tr>";
                        $('#inboxdashboard').append(str);
                    }
                    $("#inboxdashboard").show();

                }
            });
});

一切正常，我看到桌子上的所有数据都在正确的位置。但我想要实现的是：每次我点击#inboxdashboard表的tr时，我都希望看到一个警告，显示我点击的行的ID。

我试过了，但我失败了：

$(document).ready(function ()
{      
      $("#inboxdashboard tr").on("click", function() {
      alert("ID:  " + $(this).attr('id'));
});

注意：如果我在HTML中创建行，一切正常。

Answer 1

你可以尝试

$(document).ready(function ()
{      
      $("#inboxdashboard").on("click","tr", function() {
      alert("ID:  " + $(this).attr('id'));
});

另一种方式

$(document).ready(function(){
}).on('click','#inboxdashboard tr',function(){
  // your code here
});

Answer 2

看起来您的点击功能缺少一个海沟支撑：

$(document).ready(function ()
{      
      $("#inboxdashboard tr").on("click", function() {
        alert("ID:  " + $(this).attr('id'))
      };
});

Answer 3

文档首次就绪时，行不存在，因此您无法将事件附加到其选择器。将其附加到文档，然后通过选择器过滤。

$(document).ready(function ()
{      
   $(document).on('click', '#inboxdashboard tr', function() {
      alert("ID:  " + $(this).attr('id'));
});

这将处理动态显示的行的点击事件。

从AJAX生成的表中获取单击行的ID

3 个答案: