Question

我有一个克隆行的按钮。我想找一个输入然后改变它的id。

我的功能：

function cloneRow(tables, rows) {
      var row = document.getElementById(rows); // find row to copy
      var table = document.getElementById(tables); // find table to append to
      var clone = row.cloneNode(true); // copy children too
      clone.id = rows; // change id or other attributes/contents
      table.appendChild(clone); // add new row to end of table
}

要克隆的行：

<tr id="row">
    <td width="5%"><button type="button" onclick="cloneRow('table', 'row')" class="btn btn-sm btn-info">Add</button></td>
    <td><button type="button" onclick="removeRow2('table')" class="btn btn-sm btn-danger">Remove</button></td>
    <td width="20%"><input type="text" required class="form-control" name="txtitemname[]" /></td>
    <td width="30%"><input type="text" class="form-control" name="txtnote[]" placeholder="e.g. box of milk, bottles of water" /></td>
    <td width="20%"><input type="text" class="form-control" style="background-color:#FFF" id="expiration-date" name="txtexpiration[]" /></td>
    <td><input type="number" required min="1" value="1" class="form-control" name="txtquantity[]" /></td>
</tr>

我希望在克隆时将过期日期的ID更改为expiration-date1。

Answer 1

<!DOCTYPE html>
<html>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>


<script>
    $(document).ready(function () {




    });
    function cloneRow() {
        var objRow;
        objRow = $('#row').clone();
        $(objRow).find('#expiration-date').attr('id', 'expiration-date' + $('#tbl_sample tr').length);
        $(objRow).attr('id', 'row_' + $('#tbl_sample tr').length)
        $('#tbl_sample').append($(objRow));
    }

</script>



<body>
  <table id="tbl_sample">

      <tr id="row">
    <td width="5%"><button type="button" onclick="cloneRow()" class="btn btn-sm btn-info">Add</button></td>
    <td><button type="button" onclick="removeRow2('table')" class="btn btn-sm btn-danger">Remove</button></td>
    <td width="20%"><input type="text" required class="form-control" name="txtitemname[]" /></td>
    <td width="30%"><input type="text" class="form-control" name="txtnote[]" placeholder="e.g. box of milk, bottles of water" /></td>
    <td width="20%"><input type="text" class="form-control" style="background-color:#FFF" id="expiration-date" name="txtexpiration[]" /></td>
    <td><input type="number" required min="1" value="1" class="form-control" name="txtquantity[]" /></td>
</tr>
  </table>
 </body>
</html>

如何在克隆的行中查找特定元素并在jquery中更改该元素的id

1 个答案: