更新表格行，jQuery

Question

我需要更新表中的某一行，已经做了“验证器”以确保在单击其他按钮后选中复选框时进行 1 行编辑，到目前为止，我写了如下内容：

$("#btnsavechanges").click(function(){


    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(0).append(document.getElementById("modsub").value);
    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(2).append(document.getElementById("modwhere").value);
    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(3).append(document.getElementById("modwhen").value);
    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(4).append(document.getElementById("modtime").value);
    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(5).append(document.getElementById("modwho").value);
    $("#tblmod").fadeOut("slow");


});

表格如下所示：

<table id='tblmod' width='80%' align='center' >
<tr bgcolor='white'>
<td width='15%'>
Enter Subject<input type="text" id="modsubject" width="15%">
</td>
<td width='15%'>
Enter Location<input type="text" id="modwhere" width="15%">
</td>
<td width='15%'>
Enter When<input type="text" id="modwhen" width="15%">
</td>
<td width='15%'>
Enter Time<input type="text" id="modtime" width="15%">
</td>
<td width='15%'>
Enter With Who<input type="text" id="modwho" width="15%">
</td>
</tr>
<tr><th align="right" style=border-width:0px><button type="button" id="btnsavechanges" value="Save New Changes" >Save Changes</button></th></tr>
</table>

Answer 1

我建议使用数据绑定框架。我最近一直在使用 knockoutjs，我喜欢它。使用 Knockout 时，我编写复杂 UI 的代码量要少得多。

基本上，您只需将data-bind 属性添加到元素即可绑定HTML。然后，当有人更改值时，它会立即在您的视图模型中更新。如果您从 AJAX 请求中提取新数据，它也会更新您的 UI。

更多信息在这里：http://knockoutjs.com/

我强烈建议您这样做，因为它可以帮助您编写更简洁、更易于管理的代码，并且速度更快。您将按照您的要求“手动”处理所有事情，从而“重新发明轮子”。