HTML 文件上传 type = "file" 也从 type = "text" 输入字段上传答案

【问题标题】：HTML file upload type = "file" is also uploading from type = "text" input fieldsHTML 文件上传 type = "file" 也从 type = "text" 输入字段上传
【发布时间】：2015-02-22 01:13:00
【问题描述】：

这是我的 HTML 代码。在浏览器中，我单击文本字段并显示一个用于文件输入的框。就像我选择了 type = "file" 输入字段。为什么我的 HTML 代码会这样？

<div id = "section">
<form action = "receive.php" method = "post">
<!-- Image to upload -->
    <label for = "item"> Item: <input id = "item" type = "file" name = "items" accept = "image/*">
<!-- Text to enter -->
    <label for = "mail"> Email: <input id = "mail" type = "text" name = "email">
    <label for = "word"> Words: <input id = "word" type = "text" name = "words">
    <input type = "submit" value = "Submit" name = "submit">
</form>
</div>

【问题讨论】：

你试过什么代码？
不，您发布的代码没有这样做。您是否有某种 JavaScript 插件或浏览器扩展可以做到这一点？
@j08691：确实如此。
@SLaks - 不适用于 Chrome 或 IE（所有事物）jsfiddle.net/c1d64qj7

标签： html image file upload

【解决方案1】：

你需要关闭你的<label>标签。

否则，你的整个表单都在<label>为上传控件，点击标签就会点击控件。

【讨论】：

【解决方案2】：

您没有正确关闭元素，很可能是 <label> 元素。

<div id = "section">
<form action = "receive.php" method = "post">
<!-- Image to upload -->
    <label for = "item"> Item: <input id = "item" type = "file" name = "items" accept = "image/*"></label>
<!-- Text to enter -->
    <label for = "mail"> Email: <input id = "mail" type = "text" name = "email"></label>
    <label for = "word"> Words: <input id = "word" type = "text" name = "words"></label>
    <input type = "submit" value = "Submit" name = "submit">
</form>
</div>

【讨论】：