哪些浏览器支持在 input[type="file"] 元素上触发点击事件？答案

【问题标题】：Which browsers support triggering click event on input[type="file"] elements?哪些浏览器支持在 input[type="file"] 元素上触发点击事件？
【发布时间】：2011-10-26 15:50:16
【问题描述】：

根据https://developer.mozilla.org/en/Using_files_from_web_applications，

从 Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1) 开始，您可以隐藏公认丑陋的文件元素并展示您的自己的界面，用于打开文件选择器并显示哪个文件或用户选择的文件。

使用这样的东西（使用 jQuery）：

$('a.upload').click(function(e) {
  e.preventDefault();
  $('input[type="file"]').click();
});

我不是在问还有什么其他方法可以更好地做到这一点。我想知道还有哪些其他浏览器支持像这样输入文件的点击事件？

【问题讨论】：

Chrome 可以。 FF 3.5 没有。 IE 显然没有（可能是 IE9 及更高版本，但尚未测试）。
我刚刚确认它适用于：IE8 和 IE9

标签： javascript javascript-events

【解决方案1】：

firefox 3.2+ 版本不支持 AFAIK，因为如果文件输入被隐藏，chrome 和 ie 支持会出现一些安全问题，我猜这就是为什么人们触发点击将文件输入直接放在假元素后面的原因

【讨论】：

Firefox 17 是否支持 .click() 。我不知道它改变了哪个版本。

【解决方案2】：

我已经运行了一个测试，它使用 display: none 隐藏原始文件输入，并使用 jQuery 在触发按钮上运行 click 事件。

至少适用于：IE7 及更高版本、FF 4.0 及更高版本、Safari 4.0 及更高版本 (Win)、Chrome 14.0 及更高版本。不适用于：FF 3.6 及更早版本。

【讨论】：