4

フォームがあり、必要に応じて、フォーム フィールドの大きなブロックを何度も繰り返す (複製して追加する) 必要があります。

だから、私がやったことは、ページの隠しdivにコピーしたいコードを入れて、基本的にユーザーが「追加」というボタンをクリックできるようにして、これらの空白を追加することです最後のロットの下にあるフォーム フィールドを、必要な回数だけ入力します。

クローンしたいhtmlは次のとおりです。

 <div style="display: none;">
        <div class="grab-me">
          <input name="foo[]" />
          <input name="bar[]" />
          <input name="oth[]" />
        </div>
 </div>

私が現在持っているjqueryは次のとおりです。

$(function(){
        $('.add-member').live("click", function(e){
            e.preventDefault(e);
            var grab = $('.grab-me');
            grab.appendTo('#register');

        });
    });

しかし、ボタンがクリックされるたびにフォーム フィールドが複製されます。一度クリックすると、期待どおりにフォームフィールドが一度に追加されます。ボタンをもう一度クリックすると、今度はフォーム フィールドが 2 回追加されます。もう一度クリックすると、フォーム フィールドが 3 セット追加されます。

クリックするたびに、1セットのフォームフィールドを一度に追加したいだけです。

どんなアドバイスでも本当に感謝しています！

4

3 に答える 3

5

これは、コピーすると 2 つの.grab-me要素があるためです。要素を複製した後、クラスを削除する必要があります。

var grab = $('.grab-me')
    .clone()
    .removeClass('grab-me')
    .appendTo('#register');
于 2013-03-11T13:02:51.803 に答える
0

$（'。grab-me'）。eq（0）1つのフォーム（クラスgrab-meを持つ最初のフォーム）を取得するため

$(function(){
        $('.add-member').live("click", function(e){
            e.preventDefault(e);
            var grab = $('.grab-me').eq(0);
            grab.appendTo('#register');

        });
    });
于 2013-03-11T12:58:06.953 に答える
0

できることがいくつかあります。私の頭に浮かぶ最も簡単な方法は、.first() 呼び出しを追加することです。

$(function(){
        $('.add-member').live("click", function(e){
            e.preventDefault(e);
            var grab = $('.grab-me').first().clone();
            grab.appendTo('#register');
        });
});

遭遇する問題は、.grab-me クラスを持つ 2 つの div を初めて追加した後で、jquery が両方を取得することです。

于 2013-03-11T12:54:29.303 に答える