如何将对象与表格行关联？答案

【问题标题】：How do I associate an object with a table row?如何将对象与表格行关联？
【发布时间】：2016-01-29 21:20:40
【问题描述】：

我在 javascript 中有一个对象数组。我表中的每一行代表数组中一个对象的大约 3 个属性。我有一个用于<input type="text"/> 的模糊事件的 jquery 事件处理程序。我希望能够更新数组中的对象。问题是我不知道哪一行与数组中的哪个对象相关联。

有什么方法可以将每个对象的引用附加到行？我尝试如下所示直接附加它，但是当blur 事件被触发。

var row = table.insertRow(-1);
row.attachedObject = myObject;

这是我的 blur 方法，我尝试设置附加对象的 title 属性的值。不幸的是，在调试时，附加对象显示为未定义，即使它显示在它附加到行的方法中。

    $(document).on('blur', '.name-cell', function(e) {
        var value = $(event.target).val();
        var row = $(event.target).closest("tr");
        row.attachedObject.title = $(event.target).val();
        e.preventDefault();  // to prevent the default action of anchor elements
    });

【问题讨论】：

标签： javascript jquery arrays javascript-objects

【解决方案1】：

将对象标识符保存为输入属性或表格行属性：

<input type="text" data-target="<obj.id>" ... />

或

<tr data-target="<obj.id>">

这将允许您稍后在模糊处理函数中获取该值：

$(document).on('blur', '.name-cell', function(e) {
        var value = $(event.target).val();
        var row = $(event.target).closest("tr");
        var id = $(row).attr('data-target');
        row.attachedObject.title = $(event.target).val();
        e.preventDefault();  // to prevent the default action of anchor elements
    });

【讨论】：