it-swarm.com.de

Gibt es eine Möglichkeit, Formularfeldwerte in jQuery oder Javascript zu klonen?

jQuery verfügt über eine clone() -Funktion, die das eigentliche Formular problemlos klont, jedoch keine in das Formular eingegebenen Werte beibehält.

Gibt es eine Möglichkeit, dies zu umgehen?

Beispielcode wäre sehr dankbar.

25
Fred

stieß auf das gleiche Problem, einfache Lösung:

// touch all input values
$('input:text').each(function() {
    $(this).attr('value', $(this).val());
});

var clones = $('input:text').clone();

der Trick ist, dass dies das tatsächliche 'value'-Attribut im DOM-Baum ändert. Andernfalls sind die Daten, die Sie' on-the-fly 'eingeben, nur im DOM-Status' state 'vorhanden.

26
sled

Aus den Notizen geht eine Lösung hervor. Mit folgendem Formular:

<form id="old">
    <textarea>Some Value</textarea>
    <input type="text" value="Some Value" />
    <input type="checkbox" value="bob" checked />
    <br />
</form>

<input type="button" value="Clone" id="clone" />

Diese jQuery funktioniert, einschließlich der Textbereiche:

$( 'input#clone' ).click(
    function()
    {
      $( 'form#old textarea' ).text( $( 'form#old textarea' ).val() )
      $("form#old").clone().attr( 'id', 'new_form' ).appendTo("body")

    }
)

Demo: http://jsfiddle.net/Jux3e/

8
hookedonwinter

Eine weitere einfache Lösung für die nicht geklonten Textbereichswerte besteht darin, die folgende JavaScript-Datei in Ihren HTML-Code aufzunehmen: https://github.com/spencertipping/jquery.fix.clone

Die Klonmethode wird nur gepatcht, sodass Sie die Datei einbinden und dann vergessen können, dass sie dort ist. Anscheinend gibt es auch ein Problem beim Klonen ausgewählter Werte, und dieselbe Datei behebt auch dieses Problem.

Diese Datei wurde verlinkt von: http://bugs.jquery.com/ticket/3016 . Der Bug ist 4 Jahre alt.

4
Ben

wenn Sie das Feld selbst duplizieren müssen, aktivieren Sie diese Funktion relCopy

0
numediaweb

Sie können dieses jQuery-Plugin verwenden.

/**
 * clone element, including the textarea part
 */


$.fn.clone2 = function(val1, val2) {
    // ret for return value, cur for current jquery object
    var ret, cur;
    ret = $(this).clone(val1, val2);
    cur = $(this);

    // copy all value of textarea
    ret.find('textarea').each(function() {
        var value_baru;

        // use name attribute as unique id
        value_baru = sek.find('[name="$name"]'.replace('$name', $(this).attr('name')))
                        .val();

        // set the new value to the textarea
        $(this).val(value_baru);
    });

    // return val
    return ret;
}
0
waza

Verwenden Sie diesen Code, um Textbereichswerte zu kopieren

clonedObject.find(textareaObject).val(originalObject.find(textareaObject).val());
0
Manavendher

Fand dieses Problem und schrieb diesen Wrapper:

$.fn.cloneField = function(withDataAndEvents) {
var clones = [];
this.each(function(){
    var cln = $(this).clone(withDataAndEvents);
    cln.val($(this).val());
    clones.Push(cln.get(0));
});
return jQuery( clones ); }; 
0
dee32