如何解决跨浏览器打开文件浏览对话框
| 我一直在寻找圣杯-HTML中的漂亮文件对话框。我想出了一个解决方案,该解决方案使用jQuery在单击按钮时将“隐藏”文件元素“ 0”设置为“ 0”。在FireFox 4中可以正常工作,但Chrome和Opera无法运行。将click()
更改为focus()
适用于Chrome,但Opera中没有任何作用。我还没有测试过IE,但现在还不希望现在就生活下去。
这是当前代码:
的HTML
<div class=\"formFile\" id=\"profileImgContainer\">
<input type=\"file\" name=\"profileImg\" id=\"profileImg\">
<label>Profile Picture</label>
<div>
<input type=\"text\" id=\"profileImgText\"><input type=\"button\" id=\"profileImgButton\" value=\"Choose File\">
</div>
</div>
jQuery的
$(\".formFile input[type=\'file\']\").live(\'change\',function()
{
$(this).parents(\".formFile\").find(\"input[type=\'text\']\").val($(this).val());
});
$(\".formFile input[type=\'button\']\").live(\'click\',function()
{
$(this).parents(\".formFile\").find(\"input[type=\'file\']\").click();
});
$(\".formFile input[type=\'text\']\").live(\'click\',function()
{
$(this).parents(\".formFile\").find(\"input[type=\'file\']\").click();
});
谁能提供使用jQuery / JavaScript的跨浏览器打开文件对话框的方法?我不想使用透明元素技巧,因为需要进行输入交互(CSS:hover
)等。
解决方法
尝试使用
trigger()
:
$(this).parents(\".formFile\").find(\"input[type=\'file\']\").trigger(\'click\');
, 这可能要晚了几年,但是这是一种无需任何Javascript即可实现的方法,并且它也是跨浏览器的。
<label>
Open file dialog
<input type=\"file\" style=\"display: none\">
</label>
如果发现问题,则可能需要在标签中使用指向输入ID的for属性。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。