Javascript 将输入值从一个表单复制到另一个表单_Javascript_Jquery

Javascript 将输入值从一个表单复制到另一个表单

javascript jquery

Javascript 将输入值从一个表单复制到另一个表单,javascript,jquery,Javascript,Jquery,如果每个表单中的输入具有相同的名称，那么将输入值从一个表单复制到另一个表单的最佳方法是什么？我提出了以下几点，但是，它似乎非常低效（我知道，效率可能不重要，但我仍然想知道）。谢谢测试 $（函数（）{ $（“#复制”）。单击（函数（）{ var form1=$（'#form1'）。查找（':input'）； var form2=$（“#form2”）；表1.每个（函数（）{ var$t=$（本）； form2.find（'[name=“'+$t.attr（'name'）+'“]'））.va

如果每个表单中的输入具有相同的名称，那么将输入值从一个表单复制到另一个表单的最佳方法是什么？我提出了以下几点，但是，它似乎非常低效（我知道，效率可能不重要，但我仍然想知道）。谢谢


测试
$（函数（）{
$（“#复制”）。单击（函数（）{
var form1=$（'#form1'）。查找（':input'）；
var form2=$（“#form2”）；
表1.每个（函数（）{
var$t=$（本）；
form2.find（'[name=“'+$t.attr（'name'）+'“]'））.val（$t.val（））；
});
});
});
复制

您可以使用和

您不需要克隆或替换，只需更改

值

jQuery（函数（$）{
函数copyForms（$form1，$form2）{
$（'：input[name]，$form2.val（function（））{
返回$（'：输入[name='+this.name+']'，$form1.val（）；
});
}
$（'#copy'）。在（'单击'，函数（）上）{
复印件（$（'表格1'），$（'表格2'）；
});
});
/*仅此演示*/
body{display:flex；}form{padding:16px；background:#ddd；}form>*{框大小：边框框；宽度：100%；}

形式
巴兹
A.
B
拷贝&rarr；
隐藏形式
A.
B
你的表格这么简单吗？@Satpal。是的，但更多值。您可以使用jquery克隆函数，但它将复制DOM元素，而不仅仅是value@Satpal第二个表单需要是HTML。我这样做的全部原因是允许非JS用户能够提交两个表单，但JS用户只需要提交一个表单。您可以尝试。这里我使用了clone（）
和replaceWith（）
谢谢Roko。我喜欢！您知道我是否只能选择某些输入进行复制吗？我想把class=“copyClass”
放在form1中的一些输入上，然后像'：input[name].copyClass'如何使其不区分大小写？在示例中，我可以在form1 name=“SeaRCH”和form2=“SeaRCH”中使用@InnerWorld。你的意思是：？你试过理解上面的代码吗？我的意思是，一个简单的谷歌“如何将一个值返回到小写”将引导您在几秒钟内找到一个解决方案
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Testing</title>  
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js" type="text/javascript"></script>
        <script type="text/javascript"> 
            $(function(){
                $('#copy').click(function(){
                    var form1=$('#form1').find(':input');
                    var form2=$('#form2');
                    form1.each(function() {
                        var $t=$(this);
                        form2.find('[name="'+$t.attr('name')+'"]').val($t.val());
                    });
                });

            });
        </script>
    </head>

    <body>
        <button id="copy">copy</button>
        <form id="form1">
            <input name="a" type=text>
            <input name="b" type=text>
            <input name="c" type=text>
            <input name="d" type=text>
        </form>
        <form id="form2">
            <input name="a" type=text>
            <input name="b" type=text>
            <input name="c" type=text>
            <input name="d" type=text>
        </form>

    </body> 
</html>

$('#copy').click(function(){
    var newform2=$('#form1').clone(); //Clone form 1
    newform2.filter('form').prop('id', 'form2'); //Update formID
    $('#form2').replaceWith(newform2);
});