0

行が複製された編集可能なテーブルがあります。複製された行は、テキスト領域と入力番号の両方の列で編集可能です。クリックして入力番号を編集すると、合計を計算して自動的に合計金額を算出する機能があります。

私の問題は、複製された行の削除ボタンを適切に構成できないことです。試してみると、行を削除する代わりに、もう1つ追加されていることがわかります。この問題を理解する方法について助けが必要です。

これは複製された行のスクリプトです。削減して改善する必要があると思います

$('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');

私のテーブル

4

2 に答える 2

1

  1. tr.after関数を次のように変更します。

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

  2. 次のようにremove()電話をかけます。

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

これがフィドルです。

于 2012-10-19T06:41:57.880 に答える
0

正しい解決策でフィドルを編集しました：http：//jsfiddle.net/Manna/S3kZw/5/

  • クラスはボタンタイプの入力でもあるためtr_clone_remove、削除ボタンをクリックするたびに最初のハンドラーが呼び出されます。

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

    これが、行が削除されるのではなく挿入される理由です。

  • また、削除行ブロックを正しいコードで更新しました。
于 2012-10-19T06:33:20.517 に答える