javascript - 使用 Bootstrap 将文件输入整理成形状

Question

我想使用 Bootstrap 将文件输入包装在按钮内。但是我遇到了一个问题，我无法访问输入文件，这意味着我无法在使用 Internet Explore 时上传文件，而它在 Chrome 上运行良好。有人知道为什么会出现这个问题吗？ . Here is the Jsfiddle code

Answer 1

I would like to wrap the file input inside of a button

这会创建无效的 HTML。 http://www.w3.org/TR/html5/forms.html#the-button-element :

“Content model: Phrasing content, but there must be no interactive content descendant.”

(由我突出显示。)

input 是交互式内容(除非它有type=hidden)，所以它不允许作为button的后代。

当您开始创建无效的 HTML 时，您不能期望跨浏览器的结果一致。因此，告别“在按钮内输入”的方法。

---

http://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/有关于如何设置文件输入样式的建议。