有没有办法在 jQuery 或 javascript 中克隆表单字段值?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/3250685/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 15:07:42  来源:igfitidea点击:

Is there a way to clone form field values in jQuery or javascript?

jqueryformsclone

提问by Fred

jQuery has a clone()function that clones the actual form with no problem, but it doesn't preserve any values that have been entered into the form.

jQuery 有一个clone()函数可以毫无问题地克隆实际表单,但它不会保留任何已输入表单的值。

Is there a way to get around this?

有没有办法解决这个问题?

Sample code would be much appreciated.

示例代码将不胜感激。

回答by sled

ran into the same problem, simple solution:

遇到同样的问题,简单的解决方法:

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

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

the trick is that this will change the actual 'value' attribute in the DOM tree, otherwise the data you enter 'on-the-fly' only exists in the DOM 'state'

诀窍在于,这将更改 DOM 树中的实际“值”属性,否则您“即时”输入的数据仅存在于 DOM“状态”中

回答by hookedonwinter

Stemming from the notes, here's a solution. With the following form:

根据笔记,这里有一个解决方案。使用以下形式:

<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" />

This jQuery works, including the textareas:

这个 jQuery 工作,包括 textareas:

$( '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/

?演示:http: //jsfiddle.net/Jux3e/

回答by Ben

Another easy fix for the textarea values not being cloned is to include the following JavaScript file in your HTML: https://github.com/spencertipping/jquery.fix.clone

未克隆 textarea 值的另一个简单修复是在 HTML 中包含以下 JavaScript 文件:https: //github.com/spencertipping/jquery.fix.clone

It just patches the clone method so you can include the file and then forget it's there. Apparently there is a problem with cloneing select values too and this same file fixes that problem as well.

它只是修补克隆方法,因此您可以包含文件,然后忘记它在那里。显然,克隆选择值也存在问题,这个文件也解决了这个问题。

This file was linked to from: http://bugs.jquery.com/ticket/3016. The bug is 4 years old.

该文件链接到:http: //bugs.jquery.com/ticket/3016。这个bug已经4岁了。

回答by Manavendher

Use this code to copy textarea values

使用此代码复制 textarea 值

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

回答by waza

You may use this jQuery Plugin.

您可以使用这个 jQuery 插件。

/**
 * 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;
}

回答by dee32

Found this problem and wrote this 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 ); }; 

回答by numediaweb

if you need to duplicate the field itself, check this tinny function relCopy

如果您需要复制字段本身,请检查这个微小的函数relCopy