草庐IT

javascript - 将输入值从一种形式复制到另一种形式

coder 2025-02-23 原文

将输入值从一种形式复制到另一种形式且每种形式的输入具有相同名称的最佳方法是什么？我想出了以下内容，但是，它似乎非常低效(我知道，效率可能并不重要，但仍然想知道)。谢谢

http://jsbin.com/beyixeqa/1/ 

<!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>

最佳答案

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

jQuery(function( $ ) {


  function copyForms( $form1 , $form2 ) {
    $(':input[name]', $form2).val(function() {
      return $(':input[name=' + this.name + ']', $form1).val();
    });
  }

  $('#copy').on('click', function() {
    copyForms(  $('#form1') , $('#form2')  );
  });


});
/*this demo only*/
body{display:flex;}form{padding:16px;background:#ddd;}form>*{box-sizing:border-box;width:100%;}
<form id=form1>
  FORM
  <input    name=a type=text value="FOO">
  <input    name=b type=button value="BAR">
  <textarea name=c>BAZ</textarea>
  <select   name=d>
    <option value="a">a</option>
    <option value="b" selected>b</option>
  </select>
</form>

<button id="copy">COPY&rarr;</button>

<form id=form2>
  HIDDEN FORM
  <input    name=a type=text>
  <input    name=b type=button value="...">
  <textarea name=c></textarea>
  <select   name=d>
    <option value="a">a</option>
    <option value="b">b</option>
  </select>
</form>

<script src="//code.jquery.com/jquery-3.1.0.min.js"></script>

  • 通过使用 :input[name]，您可以确保仅 :input 具有name属性
  • $(':input[name]', form2) = #form2
    • 的后代
  • 使用 val 回调，您可以定位每一个目标输入
  • 返回它们的值与它们引用的同名- :inputs of #form1

关于javascript - 将输入值从一种形式复制到另一种形式，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22015925/

javascript一种codeformgtjquery

有关javascript - 将输入值从一种形式复制到另一种形式的更多相关文章

  1. ruby-on-rails - 使用回形针的嵌套形式 - 2

    我有一个名为posts的模型，它有很多附件。附件模型使用回形针。我制作了一个用于创建附件的独立模型，效果很好，这是此处说明的View(https://github.com/thoughtbot/paperclip):@attachment,:html=>{:multipart=>true}do|form|%>posts中的嵌套表单如下所示:prohibitedthispostfrombeingsaved:@attachment,:html=>{:multipart=>true}do|at_form|%>附件记录已创建，但它是空的。文件未上传。同时，帖子已成功创建...有什么想法吗？

  2. ruby - 鸭子输入字符串、符号和数组的优雅方式？ - 2

    这是针对我无法破坏的现有公共(public)API，但我确实希望对其进行扩展。目前，该方法采用字符串或符号或任何其他在作为第一个参数传递给send时有意义的内容我想添加发送字符串、符号等列表的功能。我可以只使用is_a吗？数组，但还有其他发送列表的方法，这不是很像ruby​​。我将调用列表中的map，所以第一个倾向是使用respond_to?:map。但是字符串也会响应:map，所以这行不通。 最佳答案 如何将它们全部视为数组？String的行为与仅包含String的Array相同:deffoo(obj,arg)[*arg].eac

  3. ruby-on-rails - 有没有一种工具可以在编码时自动保存对文件的增量更改？ - 2

    我最喜欢的Google文档功能之一是它会在我工作时不断自动保存我的文档版本。这意味着即使我在进行关键更改之前忘记在某个点进行保存，也很有可能会自动创建一个保存点。至少，我可以将文档恢复到错误更改之前的状态，并从该点继续工作。对于在MacOS(或UNIX)上运行的Ruby编码器，是否有具有等效功能的工具？例如，一个工具会每隔几分钟自动将Gitcheckin我的本地存储库以获取我正在处理的文件。也许我有点偏执，但这点小保险可以让我在日常工作中安心。 最佳答案 虚拟机有些人可能讨厌我对此的回应，但我在编码时经常使用VIM，它具有自动保存功

  4. ruby-on-rails - Rails 单选按钮 - 模型中多列的一种选择 - 2

    我希望用户从一个模型的三个选项中选择一个。即我有一个模型视频，可以被评为正面/负面/未知目前我有三列bool值(pos/neg/unknown)。这是处理这种情况的最佳方式吗？为此，表单应该是什么样的？目前我有类似的东西但显然它允许多项选择，而我试图将它限制为只有一个..怎么办？ 最佳答案 如果要使用字符串列，让我们说rating。然后在你的表单中:#...#...它只允许一个选择编辑完全相同但使用radio_button_tag: 关于ruby-on-rails-Rails单选按钮-模

  5. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  6. ruby - 在 Ruby 中是否有一种惯用的方法来操作 2 个数组？ - 2

    a=[3,4,7,8,3]b=[5,3,6,8,3]假设数组长度相同，是否有办法使用each或其他一些惯用方法从两个数组的每个元素中获取结果？不使用计数器？例如获取每个元素的乘积:[15,12,42,64,9](0..a.count-1).eachdo|i|太丑了...ruby1.9.3 最佳答案 使用Array.zip怎么样？:>>a=[3,4,7,8,3]=>[3,4,7,8,3]>>b=[5,3,6,8,3]=>[5,3,6,8,3]>>c=[]=>[]>>a.zip(b)do|i,j|c[[3,5],[4,3],[7,6],

  7. ruby - 如何在 ruby​​ 中复制目录结构，不包括某些文件扩展名 - 2

    我想编写一个ruby​​脚本来递归复制目录结构，但排除某些文件类型。因此，给定以下目录结构:folder1folder2file1.txtfile2.txtfile3.csfile4.htmlfolder2folder3file4.dll我想复制这个结构，但不包含.txt和.cs文件。因此，生成的目录结构应如下所示:folder1folder2file4.htmlfolder2folder3file4.dll 最佳答案 您可以使用查找模块。这是一个代码片段:require"find"ignored_extensions=[".cs"

  8. ruby - ruby 中的同一个程序如何接受来自用户的输入以及命令行参数 - 2

    我的ruby​​脚本从命令行参数获取某些输入。它检查是否缺少任何命令行参数，然后提示用户输入。但是我无法使用gets从用户那里获得输入。示例代码:test.rbname=""ARGV.eachdo|a|ifa.include?('-n')name=aputs"Argument:#{a}"endendifname==""puts"entername:"name=getsputsnameend运行脚本:rubytest.rbraghav-k错误结果:test.rb:6:in`gets':Nosuchfileordirectory-raghav-k(Errno::ENOENT)fromtes

  9. ruby - 在两个 ActiveRecord 类之间合并/复制属性的好方法？ - 2

    之前有人问过这个问题，我发现了以下clip关于如何一次设置一个类对象的所有属性，但由于批量分配保护，这在Rails中是不可能的。(例如，您不能Object.attributes={})有没有一种很好的方法可以将一个类的属性合并到另一个类中？object1.attributes=object2.attributes.inject({}){|h,(k,v)|h[k]=vifObjectModel.column_names.include?(k);h}谢谢。 最佳答案 利用assign_attributes使用:without_prote

  10. ruby - 有没有一种 Ruby 方法可以删除初始化程序中的样板代码？ - 2

    我写了很多initialize代码，将attrs设置为参数，类似于:classSiteClientattr_reader:login,:password,:domaindefinitialize(login,password,domain='somedefaultsite.com')@login=login@password=password@domain=domainendend有没有更像Ruby的方式来做到这一点？我觉得我在一遍又一遍地编写相同的样板设置代码。 最佳答案 您可以使用rubyStruct:classMyClass或

随机推荐