行の追加(クローン)

DDD
リリース: 2025-01-05 00:16:40
オリジナル
632 人が閲覧しました

Add Row (Clone)

今日は、tr の複製と削除を動的に実装する簡単な方法と、最後の tr を削除せずに保持する方法を共有します。

*以下の要件: *

  1. TR を追加するセレクター
  2. セレクタークラスの追加/削除
<table>



<h2>
  
  
  JS Code
</h2>



<pre class="brush:php;toolbar:false">$(document).ready(function() {
        $(document).on('click', '.addTr', function() {
            let $clone = $(this).closest('tr').clone();
            $clone.find('input').val('');

            $('.productServicesTbody').append($clone);
        });

        $(document).on('click', '.removeTr', function() {
            if ($('.productServicesTbody tr').length > 1) {
                $(this).closest('tr').remove();
            }
        });
    });
ログイン後にコピー

ここで .addTr は、新しい tr ボタンの追加セレクターです。 .removeTr は、新しい tr ボタンを追加するセレクターです。

ご不明な点がございましたら、コメント欄にご記入ください。

ハッピーコーディング #Js #jQuery

以上が行の追加(クローン)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート