jQueryのクローン作成divからインクリメンタルなHTMLデータID属性のクリック

Question

私はUIを構築するために、TwitterのブートストラップCSSフレームワーク+ jQueryを使用しています。

$(document).on('click', 'button.addDiv', function() { 
    var lastDiv = $(this).closest('.form-group').siblings().last(); 
    var id = lastDiv.data('id'); 
    var newDiv = lastDiv.clone(true); 
    ... 

それぞれのdiv：私のインターフェイスで

は、私はこのように、いくつかのdivと「新しい」最後の位置でクリックし、DOMに挿入したときに、それらの最後のクローンを外部のボタンを持っていますdata-idのHTML属性に1から始まる番号が付いています。新しい動的divに後続のIDが必要です。そのために、私が持っている：

... 
    newDiv.attr('data-id', id + 1); 
    newDiv.insertAfter(lastDiv); 
}); 

私が欲しいまさにん

が、ボタンがクリックされたONLY初めて...（すなわちdata-idが正しく、唯一のページのロードにすでにdivタグで2に設定されています動的に追加されません）。 しかし、新しいボタンが最後に1つ（正しい方法）を挿入し続けるが、data-idは2のままです。

何が起こっているのでしょうか？ ありがとうございます。

Answer 1

何が起こっているnewDiv.data("id", id + 1);

でnewDiv.attr('data-id',id+1)を交換するには、あなたは属性としてDOM要素にデータ-IDを付加していることです。 JQueryはこれを要素のデータとして登録しません。次に、divをクローンしているので、各クローンされたdivは2のデータIDを保持します。