Question

我创建了一个页面，我在其中执行搜索，并以行的形式返回产品数量及其名称，价格和所有内容。使用jQuery的clone功能动态创建行。每行中都有一个复选框，也可以通过克隆创建。

我现在尝试的是遍历每一行，并根据是否选中该复选框获取每行中的值。但是在动态克隆表中，遍历似乎是一个问题。

Answer 1

我希望我能正确理解你的挑战。此示例显示一个警报，其中包含已选中复选框的克隆行的复选框值，忽略未选中的复选框。虽然我确信这不是您正在寻找的，但您可以将其作为如何遍历克隆表的示例。

<!DOCTYPE html>
<html>
<head>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>

  <script type="text/javascript">

    $(document).ready(function() {

      var orig_table_rows = $('#original_table').children().clone();

      $("#new_table").append(orig_table_rows);

      orig_table_rows.children().each(function() {
        $(this).find("input:checked").each(function() {
          alert( $(this).val() );
        });
      });

    });

  </script>
</head>
<body>

original table:
<table id="original_table" style="border:1px solid red;">
  <tr>
    <td><input type="checkbox" name="checkbox_name" value="not_checked_value"></td>
    <td>name</td>
    <td>price</td>
    <td>everything</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="checkbox_name" value="checked_value" checked></td>
    <td>name</td>
    <td>price</td>
    <td>everything</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="checkbox_name" value="another_checked_value" checked></td>
    <td>name</td>
    <td>price</td>
    <td>everything</td>
  </tr>
  <tr>
    <td><input type="checkbox" name="checkbox_name" value="not_checked_value"></td>
    <td>name</td>
    <td>price</td>
    <td>everything</td>
  </tr>
</table>

<br>
<br>

table using the cloned rows:
<table id="new_table" style="border:1px solid blue;">
</table>

</body>
</html>

在动态克隆创建的表中遍历

1 个答案: