需要通过 PHP 和 PHP 将文件输入元素从一种表单克隆到另一种表单中。 JavaScript

Question

好的，我有一个通过 method="POST" 提交的模板函数。 但我无法正常提交此内容，因为这就是我想要提交的所有内容，并且代码上方和代码下方已经定义了一个标签，关闭表单时必须保留该标签。 由于无法在表单中包含表单，因此我使用 Javascript 创建表单并即时提交。 但我需要获取 document.forms.creator 表单中定义的文件输入元素的副本。 我正在使用 PHP 和 Javascript 来完成我现在所拥有的任务，但是 cloneNode(true) 没有获取 $_FILES['image'] 数组并将其设置为 $_FILES['sigImg'] 数组:(

echo '<tr><td colspan="2"><a href="#" name="sig' . $user_info['id'] . '"></a><center><b>Signature Image Rotator</b></center><br /><center>
Add Image: <input type="file" size="48" id="imagefile" name="image" />&nbsp;&nbsp;<input type="button" value="Upload" onclick="createFormAndSubmit()"></center>';


echo '
<script language="JavaScript" type="text/javascript"><!-- // --><![CDATA[
//helper function to create the form
function getNewSubmitForm(){
 var submitForm = document.createElement("FORM");
 document.body.appendChild(submitForm);
 submitForm.enctype = "multipart/form-data";
 submitForm.method = "POST";
 return submitForm;
}

//function that creates the form, clones <input type="file" name="image">,
//and then submits it
function createFormAndSubmit(){
 var submitForm = getNewSubmitForm();
 var element = document.getElementById("imagefile");
    element = element.cloneNode(true);
    element.id = \'sigImgId\'; //<- ID Assignment
    element.name = \'sigImg\'; //<- NAME Assignment
    submitForm.appendChild(element);
 submitForm.action= "', $scripturl, '?action=sigimages;sa=upload";
 submitForm.submit();
}
// ]]></script></td></tr>';

我该如何获取 php echo 中定义的文件输入的真实克隆并将其放入 createFormAndSubmit() 函数中定义的表单中？

请有人帮忙...

Answer 1

另一个线程上的 Mark Allen 评论建议不要将新的克隆输入（IE 不会提供所选文件属性）附加到另一个表单，而是用新输入替换旧输入（看起来正确），然后将旧的输入放在上传表单上。

所以你的代码将变成：

// clone up a new one
var oldFile = document.getElementById("imagefile");
var newFile = oldFile.cloneNode(true);

// set props
newFile.id = "sigImgId"; //<- ID Assignment
newFile.name = "sigImg"; //<- NAME Assignment

// replace old with new
oldFile.parentNode.replaceChild(newFile, oldFile);

// attach old to upload form
submitForm.appendChild(oldFile);

Answer 2

好的，非常感谢克里斯，一定会记住这一点。 我自己刚刚想出了一种方法来解决这个问题，并且正在使用这种方法，它只是更改表单的操作并提交，唯一的问题是它提交表单中的所有内容，而不仅仅是图像文件对象。 但我想这并不是真正的问题，不是吗？ 无论如何，使用此代码：

// change the action and submit the form...
function submitSigImg(){
 var mainForm = document.forms.creator;
 mainForm.action= "', $scripturl, '?action=sigimages;sa=upload";
 mainForm.submit();
}

这只是更改其已存在的表单的操作，并且由于此函数仅在单击上传按钮并重定向回页面时使用，因此正常提交表单时也不是问题。

再次感谢 ：）