Question

我需要将行参数传递给我的onclick函数。

这是我的代码：

function renderHostTableRowJob (dataTable) {
    for (var i in dataTable) {
        var notification = dataTable[i];
        var row = document.createElement("tr");
        var cell = document.createElement("td");
        cell.innerText = notification["Name"];
        row.appendChild(cell);
        var cell = document.createElement("td");
        cell.innerText = notification["State"];
        row.appendChild(cell);
        var cell = document.createElement("td");
        cell.innerText = (notification["NotificationReceived"] === true) ? "Received" : "Missing";
        row.appendChild(cell);
        row.onclick = function() {alert(notification["Name"]);};
        $("#" + notification["Client"] + "_TableJobDetails > #" + notification["Client"] + notification["HostFormated"] + "_TableBodyJobDetails")[0].appendChild(row);
    }
}

目前我的所有row.onclick = function() {alert(notification["Name"]);};都在循环中返回最后一次迭代的值......

问题：如何在每次迭代时将我的值发送到click事件？

感谢

Answer 1

捕获notification作为匿名函数的参数。由于看起来你正在使用jQuery，你可以使用jQuery.each，这将简化你的迭代，并作为副作用捕获它：

$.each(dataTable, function(index, notification) {
    // ...
});

顺便说一句，如果你使用的是jQuery，你可以更简洁地编写代码：

var row = $('<tr>').click(function() {
    alert(notification.Name);
});
$('<td>').text(notification.Name).appendTo(row);
$('<td>').text(notification.State).appendTo(row);
$('<td>').text(notification.NotificationReceived ? 'Received' : 'Missing').appendTo(row);
row.appendTo('#' + notification.Client + '_TableJobDetails > ' +
             '#' + notification.Client + notification.HostFormated + '_TableBodyJobDetails');

此外，如果您的ID是唯一的（因为它们应该是），则无需指定整个层次结构;只需使用

row.appendTo('#' + notification.Client + notification.HostFormated + '_TableBodyJobDetails');

此外，虽然代码中的更改更大，但请考虑使用on的委派。

Answer 2

我使用下面的代码：

row.onclick = (function() {
    var details = notification;
    return function() { 
        showModalJobDetails(details);
    }
})();

如何在javascript中向onclick函数发送参数

2 个答案: