-2

[+] アイコンをクリックして、テーブルの最後の行を複製し、テーブルの一番下に挿入するスクリプトがあります。私がやりたいのは、[-] アイコンをクリックして最後のテーブル行を削除できるようにすることです。これは可能ですか?もしそうなら、誰かが私を正しい方向に向けることができますか?

<script type="text/javascript">
$(document).ready(function() {
    $("#add").click(function() {
        $('#mytable tbody>tr:last').clone(true).insertAfter('#mytable tbody>tr:last');
        $('#mytable tbody>tr:last #itemid').val('');
        $('#mytable tbody>tr:last #itemdesc').val('');
        return false;
    });
});
</script>
4

3 に答える 3

2

メソッドは.remove()あなたが探しているものです：

$("#remove").click(function(e) {
    e.preventDefault();
    $('#mytable > tbody > tr:last-child').remove();
});

これe.preventDefault()は、要素のデフォルトのアクション (ボタンまたはリンク) を防止することです。return false;元の追加コードで使用しているため、デフォルトのアクションがあると想定しています。

(補足: event.preventDefault() 対 return false )

また、パフォーマンスを向上:last-childさせる代わりに、ここで使用しています。:last

:lastは jQuery 拡張機能であり、CSS 仕様の一部ではないため、使用するクエリは、ネイティブ DOM メソッドによって提供されるパフォーマンスの向上を利用できませ:lastん。querySelectorAll()を使用して要素を選択するときに最高のパフォーマンスを実現するには:last、最初に純粋な CSS セレクターを使用して要素を選択し、次に を使用します.filter(":last")。

この場合、純粋な CSS セレクターが機能するため (適切な形式のテーブルがあると仮定して)、必要はありません.filter(':last')。#add最後の行を複製するときに、コードでこれを行うこともできます。

于 2013-08-22T15:19:41.673 に答える
1

jQuery を使用します.remove()。

$("#remove").click(function(e) {
    e.preventDefault();
    $('#mytable tbody>tr:last').remove();
});
于 2013-08-22T15:20:21.040 に答える
1

はい、jQuery には次の関数があります.remove()。

$("#remove").click(function(e) {
        $('#mytable tbody>tr:last').remove();
        e.preventDefault(); // dont use return false, use preventDefault();
    });
});

return false;ここでは、自分が何をしているのかを理解していない限り、使用してはいけない理由についていくつかの情報を見つけることができます

あなたはそれをもう少し速くすることができます

$("#remove").click(function(e) {
        $('#mytable tbody tr').filter(':last').remove();
        e.preventDefault();
    });
});
于 2013-08-22T15:19:16.983 に答える