如何在复选框单击时删除一行 table？

Question

我正在生成动态 table，其中我有复选框的图集列我想在单击该复选框时删除 table 的行。

我正在动态生成 table Table结构是 RolNo|StudentName|Marks|复选框单击复选框我一直在创建另一个 table 并复制选定的行，所以使用这个..

 $('#one tbody tr td input.checkbox:not(:checked)').on('change',function(e){
  var row=$(this).closest('tr').html();
  $('#two tbody').append('<tr>'+row+'<tr>');
});

现在我想要做的是当我点击第二个 tables 复选框时应该删除该行。

还有一个问题，如果需要，我如何提取变量中的第二个 tables 字段？

Answer 1

尝试以下操作。

$(function(){      
$(document).on("click","table#id input[type='checkbox']").click(function(){      
      $(this).closest("tr").remove(); 
      });
});

Answer 2

试试这个：您需要使用 .on() 函数将点击事件绑定到动态生成的 table 中的复选框，请参见下面的代码

$(function(){
  $(document).on("click","#two input[type='checkbox']",function(){      
     //find the parent tr and remove it
     $(this).closest("tr").remove(); 
  });
});

EDIT - 在将行从 table 复制到两个时使用 .clone()，这样它将保留每个元素的单独副本

$('#one tbody tr td input.checkbox:not(:checked)').on('change',function(e){
  var row=$(this).closest('tr').clone();
  $('#two tbody').append(row);
});

Answer 3

`$('#CheckBox').click(函数(){ $(this).parents('tr').remove();

})`

Answer 4

$(function(){
   $('#CheckBox').click(function(){
       $(this).parents('tr').remove();
   })
})

Answer 5

如果我们不想在另一个 table 中显示复选框，我们可以这样做

$('#one tbody tr td input.checkbox:not(:checked)').on('change',function(e){

var row = $(this).closest('tr');
var tempRow = row.clone();
$(tempRow ).find('td:last').remove();
var tds=$(tempRow ).html();
$('#two tbody').append('<tr>'+tds+'</tr>');

});

如何在复选框单击时删除一行 table？

How to delete a row of a table on checkbox click?

html

jquery

html-table