1

jQuery.clone()メソッドを使用して、ページに複数のdivのクローンを作成しようとしています。問題は、divのクローンが作成されるとすぐに、一意のIDが必要になることです。複製されたIDもそこにある必要があります。古いIDを保持してから、番号を追加するだけで、ページにdivが増えるにつれて増加する可能性があると考えていました。

例：ベースID = 1であるため、div 1はid、、div 2は、、 div3はなどid-2になります。id-3

これは可能ですか？これに対する私の試みは以下のとおりです。

$("a").click(function(){
        var target = $(this).attr("href");
        var id = $(target).attr("id");
        $(target).clone().attr("id",id + $(id).size()).attr("class","drag").appendTo("body");
});

各aタグは次のようになります。

<a href="#one">One</a>
<a href="#two">Two</a>

次に、複製された要素は次のようになります。

<div class="drag base" style="background-color:blue" id="one"></div>
<div class="drag base" style="background-color:green" id="two"></div>
4

5 に答える 5

2

これを参照してください：http：//jsfiddle.net/3tu7V/1/

$(function(){
    $("a").click(function(){
            var target = $(this).attr("href");
            var id = $(target).attr("id"); 
            var click = $(target).data("clicked") || 0;
            $(target).data("clicked", ++click);            
            $(target).clone().attr("id",id + click).attr("class","drag").appendTo("body");

    });
});
​

あなたのコメントによると、これはあなたが望むことをしていると思います：「ああ、ベースIDが一意であるときに要素IDをリセットする方法はありますか？例）「div "one"を複製すると、"one"が生成されます-1、次に「one-2」ですが、div「two」のクローンを作成すると、「two-1」ではなく「two-3」が生成されます。

于 2012-09-09T18:44:27.003 に答える
1

改訂された回答：

セレクターで始まるjQuery属性を使用して、クローンとその数を追跡できます。

$("a").click(function() {
    var targetId = $(this).attr("href").substring(1); // "one", "two"
    var count = $("div[id^=" + targetId + "]").length; // initial value will be 1
    $("#" + targetId).clone().attr("id", targetId + '-' + count).attr("class", "drag").appendTo("body");
});

デモ

于 2012-09-09T18:30:47.140 に答える
1

私の場合、$（id）.size（）は常に= 2になると思います（最後の1つとそのクローンだけが同じIDを持ちます）、var clickNumber毎回インクリメントするグローバル変数を使用しないのはなぜですか。あなたのコードは

var clickNumber = 0;    
$("a").click(function(){
        var target = $(this).attr("href");
        var id = $(target).attr("id");
        clickNumber ++;
        $(target).clone().attr("id","id-" + clickNumber).attr("class","drag").appendTo("body");
});
于 2012-09-09T18:31:06.077 に答える
1

このライブ例を見る

var increment = 2;

$('a').live('click', function() {
    $(this).clone().attr('id','id-' + (increment++)).appendTo('body');
});​

結果：

ここに画像の説明を入力してください

于 2012-09-09T18:31:11.227 に答える
0

あなたはこのようなことをすることができます：

$('a').addClass('link');
$('body').on('click', 'a', function() {
    $(this).clone(true).attr('id', 'id-' + $('.link').length).appendTo('body');
});​

デモ： http： //jsfiddle.net/Em8PE/1/

于 2012-09-09T18:44:53.387 に答える