javascript - 如何在动态创建的 HTML 表格的单元格中读取复选框的选中状态

Question

我正在使用 JS 来确定复选框的选中状态，这些复选框包含在已动态加载到网页中的表格的单元格中。

该页面包含 2 个字段集：-

+-SelectFieldset-----------------------------+
|   <param1>  <param2>   { Load button }     |
|                        {Update button}     |
+--------------------------------------------+
+-ResultFieldset id=resultFS-----------------+
|   Ref_ID   Description     Ready           |
| +-resultTable id=outTable----------------+ |
| |  123     chair            [ ]          | |
| |  167     dresser          [ ]          | |
| |  231     sofa             [ ]          | |
| | ... etc...                             | |
| +----------------------------------------+ |
+--------------------------------------------+

上面的注释“[]”描述了一个表格单元格，其中包含 type = checkbox 的输入；param1, param2 是下拉选择器

最初 ResultFieldset 是空的；并在指定选择参数后单击“加载”按钮（使用 JQuery post 语句）时加载。

$.post("../listProducts.php", {
 AccName: account,
 From: startDate}, function(data){
  $("#resultFS").after(data);
});

显示结果表后，用户检查表行中相关的复选框。随后，当单击“更新”按钮时，我需要遍历每个表行，读取该行的 Ref_ID 值，然后根据关联复选框的选中状态，将更新发布到 MySQL 表的指定行。

循环遍历表格的代码是：-

$("#btnUpdate").on('click', function() {
   for (var i=0, row; row = outTable.rows[i]; i++) {
    var rowRef = row.cells[1].textContent;
    console.log( "Ref_ID = " + rowRef);
    var isChecked = 0;
    if (row.cells[2].firstChild.checked = true){
      isChecked = 1;
      // update MySQL table using rowRef;
    };
     console.log( "Ref_ID = " + rowRef + " Ready = " + isChecked);
   };
};

此代码按预期记录 Ref_ID 值，但我无法确定任何行中的复选框状态。（复选框在网页上的行为符合预期 - 单击设置和取消设置它们。）

请告知我应该如何编码（使用 JS 或 JQuery）。谢谢..

标签： javascriptjqueryhtml