以编程方式触发“选择文件”对话框

Question

我有一个隐藏的文件输入元素。是否可以从按钮的单击事件中触发其 选择文件 对话框？

原文由 tamakisquare 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

如果您希望有自己的按钮来上传文件而不是使用 <input type="file" /> ，您可以执行以下操作：

 <input id="myInput" type="file" style="visibility:hidden" />
<input type="button" value="Show Dialog" onclick="$('#myInput').click();" />

请注意，我使用了 visibility: hidden ，而不是 display: none 。您不能在未显示的文件输入上调用点击事件。

原文由 Mike Gwilt 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

这里的大多数答案都缺少有用的信息：

是的，您可以使用 jQuery/JavaScript 以编程方式单击输入元素，但前提是您在属于由用户启动的事件的事件处理程序中执行此操作！

因此，例如，如果您，脚本，以编程方式单击 ajax 回调中的按钮，则不会发生任何事情，但如果您将同一行代码放入用户引发的事件处理程序中，它将起作用。

PS debugger; 关键字会破坏浏览窗口，如果它是在编程点击之前……至少在 chrome 33 中……

原文由 Fazi 发布，翻译遵循 CC BY-SA 3.0 许可协议