0

jQueryを使用して、フォームの最後に複製されたdivを追加しようとしています。仕組みは次のとおりです。

 var student_number = 1;
    var orig_student = $("#student-1").clone();

    $("#add-student-link").click(function() {
         ++student_number;
         orig_student.appendTo('form.reg').attr('id', 'student-' + (student_number)).addClass("additional-student");
    });

そして、これは初めてうまく機能します、私はこのように見えるdivを取得します:

<div id="student-2" class="additional-student"></div>

しかしその後、divはIDが「student-3」の別のdivに置き換えられます。Student-3は、student-2に置き換わるのではなく、新しいdivである必要があります。何か案は?

4

2 に答える 2

1

複製するのではなく、クローンを移動するだけです(質問の下にあるコメントを参照してください)。

$("#add-student-link").click(function() {
     ++student_number;
     $("#student-1").clone().attr('id', 'student-' + (student_number)).addClass("additional-student").appendTo('form.reg');
});

クリーンなコピーを保持するためにクローンを作成している場合(私が知っている限り、要素の入力フィールドである可能性があります)、クローンをクローンします。

var orig_student = $("#student-1").clone().attr('id','');
$("#add-student-link").click(function() {
     ++student_number;
     orig_student.clone().attr('id', 'student-' + (student_number)).addClass("additional-student").appendTo('form.reg');
});
于 2013-03-02T18:53:57.263 に答える
0

初めてクリックすると、クローンされたdivが使用されるため機能します。

もう一度クリックすると、変数orig_studentは引き続き同じ div を参照し、再度追加してクラスを変更します。

機能させるには、関数内に追加する別のクローンを作成する必要があります。それがクリックで実行されるためです。

var student_number = 1;
var orig_student = $("#student-1"); // No need to clone it here

$("#add-student-link").click(function() {
     ++student_number;
     // Create a new clone of your original div and append it
     // Like this we clone it only when really needed
     orig_student.clone().appendTo('form.reg').attr('id', 'student-' + (student_number)).addClass("additional-student");
});
于 2013-03-02T19:01:03.847 に答える