刪除按鈕以在表（可編輯）克隆行中進行配置

Question

我有一個可編輯的表，其中包含已克隆的行，已克隆的行在帶有文本區域和輸入數字的兩列中都是可編輯的。 如果單擊以編輯輸入數字，則有一個功能可以求和並自動給出總金額。

我現在的問題是我無法為克隆的行正確配置刪除按鈕。 如果您嘗試一下，您會發現它不會刪除一行，而是會添加一行。 請我需要有關如何解決此問題的幫助。

這是克隆行的腳本，我認為需要減少和改進

$('input:button').live('click',function(){
    var temprow = $('#temprow tbody').html();
    var tr = $(this).closest('tr');
    tr.after(temprow);
});

$("input.tr_clone_add").live('click', function() {
    var lastid = $('[id^="sum"]').length + 1;
    var $tr = $(this).closest('.tr_clone');
    var $clone = $tr.clone();
    $clone.find(':text').val('');
    $clone.attr('id', 'sum' + lastid)
    $tr.after($clone);
    initEditables();
    tally('p#subtotal');
    tally('p#total');
});

$(".tr_clone_remove").live("click", function() {
$(".tr_clone").last().remove();
    initEditables();
    tally('p#subtotal');
    tally('p#total');
});

initEditables();
tally('p#subtotal');
tally('p#total'); 

我的桌子

Answer 1

1. 將tr.after函數更改為：

    if ($(this).val() == '+') { tr.after(temprow); } 

2. 通過以下方式進行remove()調用：

    $(this).parent().parent().remove(); 

這是小提琴 。

Answer 2

使用正確的解決方案編輯了Fiddle： http ： //jsfiddle.net/Manna/S3kZw/5/

• 由於tr_clone_remove類也是按鈕類型的輸入，因此，每當您單擊remove按鈕時，都會調用第一個處理程序。

   $('input:button').live('click',function(){ var temprow = $('#temprow tbody').html(); var tr = $(this).closest('tr'); tr.after(temprow); }); 

  這就是為什么要插入行而不是刪除行的原因。

• 同樣，使用正確的代碼更新了刪除行塊。