IE 中的文件输入行为
我注意到 chrome 和 IE 在处理文件输入点击方面的行为有所不同。
jsFiddle 示例此处。
在 Chrome 中，单击输入（文本或按钮位）上的任意位置都会触发文件对话框。
在 IE 中（在 7 上测试），您必须单击实际按钮，而不是文本位。
问题是我在常规文本框顶部使用透明文件输入。单击文本框应打开该对话框。在 Chrome 中，这工作正常，因为输入的总大小与我的文本框的大小相同。
在 IE 中，它无法正常工作，因为用户需要单击透明文件输入的实际按钮部分。
有什么想法可以解决这个问题吗？
谢谢
I have noticed a difference in behaviour between chrome and IE of handling file input clicks.
jsFiddle example here.
In Chrome, clicking anywhere on the input (text or button bit) triggers the file dialogue.
In IE (testing on 7), you have to click on the actual button, not the text bit.
The problem is that I'm using a transparent file input on top of a regular text box. Clicking on the text box should open the dialog. In Chrome this is working fine, as the total size of the input is the same size as my text box.
In IE it doesn't work properly as the user needs to be clicking on the actual button part of the transparent file input.
Any ideas of how to fix this??
Thanks
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
看看这些人是如何做到的：http://www.filamentgroup.com/lab/jquery_custom_file_input_book_designing_with_progressive_enhancement /
策略是相同的，将自定义设计的文件输入覆盖在标准输入上，并让用户与标准输入进行交互。
他们编写了一个小 hack 来支持 IE 和 Opera 的单击，使用 jQuery 显式绑定单击事件。
请参阅：http://dwpe.googlecode.com/svn/trunk /fileinput/js/jQuery.fileinput.js（第 52 行）
Have a look at how these guys have done it: http://www.filamentgroup.com/lab/jquery_custom_file_input_book_designing_with_progressive_enhancement/
The strategy is the the same, overlay a custom designed file input over a standard one and get the user to interact with the standard one.
They have written a small hack to support the click for IE and Opera, using jQuery to bind a click event explicitly.
See: http://dwpe.googlecode.com/svn/trunk/fileinput/js/jQuery.fileinput.js (Line 52)
您需要找到一种方法来触发
file输入框上的单击事件。也许在底层文本框上添加一个单击处理程序，该处理程序向文件框发出单击事件。
例如： http://jsfiddle.net/MqbrV/
它在 Firefox 中不起作用（但是默认操作应该足够了）和 Opera（没有任何工作）。
You need to find a way to trigger a click event on the
fileinput box..Maybe adding a click handler on the underlying textbox which issues the click event to the file box.
example: http://jsfiddle.net/MqbrV/
It does not work in Firefox (but the default action should be enough) and Opera (where none works).