Klonen von Elementen, die Vermeidung von mehr als einem Klon zu einem Zeitpunkt hinzufügen

http://jsfiddle.net/p57hm/

Ich möchte einfach eine weitere Klon auf jeden Klick. Hab ich was verpasst obvious_ Dank

Skript:

$(function(){

    $('input').click(function(){
        $('.cloneitem').clone().appendTo('#container');
    });

});

HTML:

<input type="button" value="clone it"/>

<div id="container"></div>

<div class="cloneitem">clone</div>
InformationsquelleAutor Johan | 2011-11-28
  1. 34

    Versuchen, diese http://jsfiddle.net/p57hm/1/

    $(function(){

    $('input').click(function(){
        $('.cloneitem:first').clone().appendTo('#container');
    });

});

    Derzeit sind Sie Klonen alle Elemente, die die Klasse .cloneitem aber Sie will nur 1 zu einer Zeit, so dass Sie nicht wollen, um alle zu markieren die .cloneItem aber nur der erste, und Klonen Sie diese.

    • danke für die Antwort
    InformationsquelleAutor Niels
  2. 3

    Ihre Klone haben immer noch die Klasse cloneitem so sind deshalb geklont wieder.
    Entfernen Sie entweder diese Klasse, oder ändern Sie den Wahlschalter so ein, dass Sie es nicht sind.

    Etwas wie dies, indem die Klasse-Klone und das herausfiltern dieser Artikel:

    $(function(){
    $('input').click(function(){
        $('.cloneitem').not('.cloned').clone().addClass('cloned').appendTo('#container');
    });    
});

    http://jsfiddle.net/infernalbadger/p57hm/4/

    • $('.cloneitem'), könnte immer noch mehr als ein element. Könnte sein gute Idee, eine ID zu verwenden, anstatt eine Klasse für das template-element (element-Klon).
    InformationsquelleAutor Richard Dalton
  3. 3

    $('.cloneitem') wählt alle Elemente mit cloneitem Klasse.

    verwenden .first():

    $('input').click(function(){
    $('.cloneitem').first().clone().appendTo('#container');
});
    InformationsquelleAutor fardjad
  4. 1

    Sind Sie Klonen eines Elements mit der Klasse "cloneitem" und dann auch anfügen, das geklonte element mit der gleichen Klasse Probleme für die nächsten Klon.

    $(function() {

    $('input').click(function(){
        $('.cloneitem').first().clone().removeClass('cloneItem').appendTo('#container');
    }); //edited

});
    • Sie sollten entfernen Sie die .first(), wie es ist unnötiger, weil die Klone cloneItem Klasse entfernt wird, werden Sie nicht geklont werden, sowieso. Diese Weise mehrere Objekte geklont werden kann auf einmal, wenn es so gewünscht wird.
    InformationsquelleAutor Stefan
  5. 1

    Hatte das gleiche Problem. Vergeben Sie eine id für das div, die Sie Klonen möchten auf diese Weise ist es einzigartig. Ein element kann nur eine id, aber viele Klassen.

    InformationsquelleAutor Nigel Tiany
  6. 0

    Sind Sie Klonen alle Elemente mit 'cloneitem' Klasse, so in der ersten Zeit, die es-Klone einmal, in der zweiten Zeit-es-Klon zwei..
    U können es beheben, indem Sie die Filter nur das erste Objekt wie folgt:

    $(function(){

    $('input').click(function(){
        $('.cloneitem').first().clone().appendTo('#container');
    });

});

    Können Sie auch wählen Sie immer die Letzte:

    $('.cloneitem').last().clone().appendTo('#container');

    Oder nur binden .clone() auf das erste Element:

    $('.cloneitem:first').clone().appendTo('#container');
    InformationsquelleAutor Jonathan
  7. -1
    $(function(){
    var clone = $('.cloneitem').clone();
    $('input').click(function(){
        clone.clone().appendTo('#container');
    });
});

    http://jsfiddle.net/tZuDe/

    InformationsquelleAutor v42
Schreibe einen Kommentar