Question

我之前看到，出于安全原因，无法使用javascript设置表单文件输入字段值。

我只想将一个FILE输入复制到另一个表单并发布，我搜索了一个工作，找不到任何东西，是否可能？

更新：我的代码：

function prepareUpload( filevalue ){

document.getElementById('logo').value =filevalue;
var mform = document.getElementById('sleeker');
    ajaxUpload( mform,'<?php echo base_url(); ?>'); // a methods to upload...
}

<input class="input-file-upload" type="file" size="20" name="logodummy" id="logodummy" onchange="prepareUpload( this.value );" />

<form action="" method="post" name="sleeker" id="sleeker" enctype="multipart/form-data" onbeforesubmit="return false;">
            <p><input type="hidden" name="logo" id="logo" /></p>
        </form>

其他任何文件输入工作正常，我可以收到$ _POST，但$ _FILES没有值。而且这个代码也很好。我觉得这个系数够了吗？

Answer 1

是的，您可以将<input type="file">放在HTML表单之外，然后使用onChange事件填写发布表单中的<input type="hidden">：

<input type="file" 
       onchange="document.getElementById('hidden_file').value = this.value;" />

<form method="POST">
    <input type="hidden" id="hidden_file" value="" />
    <input type="submit" />
</form>

但是在现代浏览器中，您只能访问文件名，而不能访问完整路径。您可能需要查看以下Stack Overflow帖子，以获取有关此主题的更多信息：

<强>更新

原始问题让我觉得您只需要将“文件名”复制到另一个HTML表单，而不是整个<input type="file">表示。

在更新之后，我假设您的意思是这样的：

<input type="file" 
       onchange="document.getElementById('hidden_file').value = this.value;" />

<form method="POST">
    <input type="file" id="hidden_file" value="" />
    <input type="submit" />
</form>

不幸的是，上述方法无效。如果您尝试上面的示例，Firefox将返回"Security error code: 1000"。

至于某些变通方法，您可能需要检查David Dorward的建议：

Answer 2

您可以将文件输入移动到另一个表单（使用appendChild或insertBefore），提交表单，然后将其移回。

Answer 3

我没有对此进行过深入测试，但它似乎可以在Firefox中使用。

使用cloneNode

var copy = file_input.cloneNode(1);
form2.appendChild(copy);

Answer 4

非常类似于cloneNode，除了jQuery

在xulrunner浏览器（如firefox）中，我成功使用了以下内容：

$('input:file').clone().appendTo($('#mainform'));

这应该将所有文件输入对象复制到id = mainform。

的表单中

避免在要克隆的对象中使用id属性。 id应始终是唯一的。

Answer 5

我意识到派对可能会迟到，但是使用HTML5，您可以使用“form”属性来定位表单，例如[form id =“the_form”] ... [/ form] ... 。[input form =“the_form type =”file“... /]

HTML：将表单字段复制到另一个表单，包括FILE输入字段？

5 个答案: