当使用javascript单击编辑按钮时，该行如何编辑？

Question

$('#dependents-info').on('click', '.btn-edit-dependent', function() { 
       var currentTD = $(this).parents('tr').find('td'); 
       //what code will I put here? 
      }); 

我希望在单击“编辑”按钮时使行可编辑，我该怎么做？

Answer 1

您需要在td内创建输入字段，然后当您想要保存它们时使用javascript来加载值并存储它们。所以，你可以做

$('#dependents-info').on('click', '.btn-edit-dependent', function() { 
 
       var currentTD = $(this).parents('tr').find('td'); 
 
       var newInput = currentTD.appendChild("input"); 
 
       newInput.setAttribute("id","newInput1"); 
 
      });

Answer 2

您可以通过添加contenteditable="true"使td编辑。见下面的代码。

 $('#dependents-info').on('click', '.btn-edit-dependent', function() { 
      var currentTD = $(this).parents('tr').find('td'); 
      currentTD.prop("contenteditable","true"); 
     }); 

希望这会有所帮助。