我有一个使用 document.createElement 动态创建的表单。组件以相同的方式创建。该表单用于将文件上传到 PHP 脚本,并在提交时在由表单的目标属性指定的 iframe 中加载响应。
不幸的是,服务器收到一个空白的 $_FILES 数组,当我检查 POST 请求时,我发现请求中没有包含文件数据。相反,如果我即时使用 Google Chrome 开发人员工具编辑动态创建的表单(在此过程中我只是编辑然后绝对不更改任何代码),此后的表单提交工作完美,发送相关文件数据.
所以这让我意识到我的表单在 html 中的构造没有任何问题,因为它在不改变任何东西的情况下工作。这让我相信浏览器不喜欢我动态创建文件输入元素?
为了完整起见,这里是动态生成的表单:
<form method="POST" action="includes/uploadPic.php"
enctype="multipart/form-data" target="fileResponse">
<input type="file" name="pic">
<input type="submit" value="Upload">
</form>
print_r($_FILES)
在服务器上给出一个空数组。
谁能给我解释一下?我的替代方案是在文档中静态创建一个隐藏表单,并在需要时将其附加到相关的 div,但我真的不喜欢那种事情。
下面是生成表单的代码:
var form = document.createElement("form");
var fileUpload = document.createElement("input");
var uploadBut = document.createElement("input");
form.setAttribute("method", "POST");
form.setAttribute("action", "includes/uploadPic.php");
form.setAttribute("enctype", "multipart/form-data");
form.setAttribute("target", "fileResponse");
fileUpload.setAttribute("type", "file");
fileUpload.setAttribute("name", "pic");
uploadBut.setAttribute ("type", "submit");
uploadBut.setAttribute ("value", "Upload");
form.appendChild(fileUpload);
form.appendChild(uploadBut);
dlgContent.appendChild(form);
最佳答案
试试这个:
var form = document.createElement("form");
var fileUpload = document.createElement("input");
var uploadBut = document.createElement("input");
form.method = "POST";
form.action = "includes/uploadPic.php";
form.enctype = "multipart/form-data";
form.target = "fileResponse"; /* I think you are trying to submit this from in an iframe */
fileUpload.type = "file";
fileUpload.name = "pic";
uploadBut.type = "submit";
uploadBut.value = "Upload";
form.appendChild(fileUpload);
form.appendChild(uploadBut);
dlgContent.appendChild(form);
关于php - 动态创建的 HTML 文件输入元素不发布数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6538885/