如何将 2 个参数传递给 jquery Find() 方法

Question

我创建了一个 table 来显示数据，当用户点击 Update 按钮时，它将 table 单元格变成用户可以输入数据的输入字段..

当我点击编辑按钮时，它成功地将 table 的 1 个单元格更改为输入字段，但我无法理解如何更改 table 的其他单元格，我需要更改所有单击 table 的单元格。

$(document).on("click", ".updateUser", function() {
  $(this).closest('tr').find('td:nth-child(2)').each(function() {
    var html = $(this).html();
    var input = $('<input type="text" />');
    input.val(html);
    $(this).html(input);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table class="table table-hover">                                       
  <thead>
    <tr>
      <th>#</th>
      <th>Username</th>
      <th>Password</th>
      <th>Role</th>
      <th>Edit</th>
      <th>Delete</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>ID</td>
      <td>Username </td>
      <td>Password </td>
      <td>Role </td>

      <td>                                                        

        <button type="button" class="updateUser btn btn-primary btn-xs" data-userId="<?php echo $id; ?>">
          EDIT BUTTON
        </button>
      </td>
    </tr>
  </tbody>                                        
</table>

我已经在 JSFiddle 上添加了示例，请指导我如何实现。

https://jsfiddle.net/tahakirmani/g7vrskpz/3/

Answer 1

从选择器中删除 nth-child(2)。 nth-child(2) 只导致第 n 个（在本例中为第二个）元素被选择并循环通过/替换为输入框。

https://jsfiddle.net/g7vrskpz/4/

 $(document).on("click", ".updateUser", function() {
   $(this).closest('tr').find('td').each(function() {
     var html = $(this).html();
     var input = $('<input type="text" />');
     input.val(html);
     $(this).html(input);
   });

 });

编辑：仅前 3 个

https://jsfiddle.net/g7vrskpz/5/

 $(document).on("click", ".updateUser", function() {
   $(this).closest('tr').find('td:nth-child(1),td:nth-child(2),td:nth-child(3)').each(function() {
     var html = $(this).html();
     var input = $('<input type="text" />');
     input.val(html);
     $(this).html(input);
   });

 });

如何将 2 个参数传递给 jquery Find() 方法

How to pass 2 arguments to jquery Find() method

javascript

jquery

jquery-selectors