javascript - jQuery 动态点击

Question

我正在尝试通过这种方式向行添加动态点击，

function addStudent(data) {
    var row = $('#students').append('<tr itemId="' + data.ID + '" ></tr>');
    row.on("click", function () {
        console.log(data.ID);  // THIS IS JUST FOR TESTING
        //loadStudent(data);
    });
}

为什么在控制台中我只点击一行就得到了所有的 ID？

问题？

在这个例子中，我在控制台中点击任何一行我得到了所有数据或学生 ID。

编辑

请注意此处的 data.ID 示例，如您所见，我在将完整对象传递给另一个方法的地方注释掉了真实代码。

Answer 1

将点击事件附加到 <tr> ，你需要这样写:

$('<tr itemId="' + data.ID + '" ></tr>').appendTo('#students').on("click", function () {
        console.log(data.ID);
        //loadStudent(data);
    });

这将创建 <tr>将其附加到 #students然后将点击事件附加到新创建的 <tr>

如果你想给事件传递数据，你可以这样做:

$('<tr itemId="' + data.ID + '" ></tr>').appendTo('#students').on("click", { value: data }, function () {            
        var theData = event.data.value;
        console.log(theData.ID);
        //loadStudent(theData);
    });

有关此概念的更多信息，请参阅 here .