如何将一个表单的文件上传字段中的值复制到另一个表单的文本字段？ [英] How to copy a value from one form's file upload field to another form's text field?

问题描述

我有一页上有两种不同的形式。第一种形式允许用户上传图像文件并通过电子邮件发送，第二种形式根据用户输入生成URL。

为了将图像名称添加到URL，我需要在第二个窗体中有一个字段，以第一个窗体的字段复制图像名称（我宁愿不必让用户浏览并在一个页面上选择图像两次）。我发现通过表单将数据从一个字段复制到另一个字段的最佳方式是这个jQuery代码： http：// jsfiddle。 net / nA37d / ，但它不适用于我的目的。例如，它从文本字段到文本字段的工作很好，但它不能从文件字段到文本字段，或文件字段到文件字段。

有没有方法来获取表单1中的文件字段的值并将其复制到表单2中的任何类型的字段？以下是我的基本代码：

 < script type =text / javascript> 
 $（function（）{
 bindGroups（）; 
}）; 
 
 var bindGroups = function（）{
 //第一个拷贝值
 $（input [name ='logotoo']）。val（$（input [name = '徽标名称']）VAL（））。 
 
 //然后绑定字段
 $（input [name ='logoname']）。keyup（function（）{
 $（input [name ='logotoo ']）。val（$（this）.val（））; 
}）; 
}; 
< / script> 
 
 
< form action =＃...method =postenctype =multipart / form-data> 
< input type =filename =logonamevalue =1/> 
< input type =submitvalue =上传/>< / form> 
 
 
 
< label>徽标名称< / label> < input type =textname =logotoo/> 
< input type =submitvalue =生成网址/>< / form> 
  

感谢您提供任何帮助！

change（）处理程序，而不是keyup：

http://jsfiddle.net/nA37d/169/

  $（input [name ='a1']）。change（function（）{
 $（input [name =' b1']）。val（$（this）.val（））; 
}）; 
  

对于输入文件来输入文件，我不认为它可能出于安全原因。

顺便说一句，这段代码应该重构。

I have one page with two different forms on it. The first form allows a user to upload and email an image file, the second form generates a URL based on the user input.

In order to add the image name to the URL, I need to have a field in the second form that copies the image name from the field in the first form (I'd rather not have to make the user browse for and select the image twice on one page). The best way I've found to copy data from one field to another across forms is this jQuery code: http://jsfiddle.net/nA37d/, but it doesn't work for my purposes. For example it works from text field to text field beautifully, but it doesn't work from file field to text field, or file field to file field.

Is there a way to grab the value of the file field in form 1 and copy it to any kind of field in form 2? Here is my basic code:

<script type="text/javascript">
$(function(){
    bindGroups();
});

var bindGroups = function() {
    // First copy values
    $("input[name='logotoo']").val($("input[name='logoname']").val());

    // Then bind fields
    $("input[name='logoname']").keyup(function() {
        $("input[name='logotoo']").val($(this).val());
    });
};
</script>


<form action="#..." method="post" enctype="multipart/form-data">
<input type="file" name="logoname" value="1" />
<input type="submit" value="Upload" /></form>


<form name="form2" action="/url/" method="get">
<label>Logo Name</label> <input type="text" name="logotoo" />
<input type="submit" value="Generate URL" /></form>

Thanks for any help you can give!

解决方案

Just use change() handler for input type file, not keyup:

http://jsfiddle.net/nA37d/169/

 $("input[name='a1']").change(function() {
        $("input[name='b1']").val($(this).val());
    });

For input file to input file, i dont think its possible for security reason.

BTW, this code should be refactorized.

这篇关于如何将一个表单的文件上传字段中的值复制到另一个表单的文本字段？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！