6

我有一个input提交文件的表单,我设置了它的样式,因为我不喜欢原生样式。现在,我有一个按钮,单击该按钮会打开对话框以选择文件。在 Firefox 和 Chrome 上单击即可正常工作,但在 IE 中不起作用。该按钮需要双击才能在 IE 中打开对话框。

我尝试使用 jQuery 通过单击触发双击:

$("input").click(function() { 
    $(this).dblclick(); 
});

但是,它似乎不起作用。是否有任何其他方法可以触发 IE 双击?

这是演示:http: //jsfiddle.net/HAaFb/

4

8 回答 8

3

像这样的东西怎么样:

var count=0;
$("input").click(function(e) { 
    count++;
    if(count==2){
         count=0;
    }else{
        e.preventDefault();
    }
});

演示:http: //jsfiddle.net/HAaFb/1/

http://jsbin.com/ukotit/17/edit

于 2013-03-11T16:44:31.403 回答
3

我发现 jQuery 文件上传演示页面实际上重新定位了文件输入字段(在“隐藏”时),以便“浏览”按钮很好地位于“添加文件”按钮的区域内。因此,当您使用 IE 8/9/10 单击该按钮时,只需单击一下即可打开。

http://blueimp.github.io/jQuery-File-Upload/

在我看到的一个 CSS 中:

.fileinput-button input {
...
right: 0px;
...
transform: translate(300px, 0) scale(4);
}
于 2013-06-07T15:44:31.997 回答
2

答案不是触发 dblclick,而是使用 IE 打开文件对话框……对吗?所以我认为解决办法是触发对文件输入的点击(将被隐藏?)

$("#formId").find("input[type='file']").trigger('click');

在你的小提琴中,我这样做:

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

我试试这个

$('input[type="file"]').hide().parent().append($('<span />').attr('class', 'filebutton').text('Upload'));
$(".filebutton").click(function() { 
    $('input[type="file"]').click(); 
});

有了这个 CSS

form {
    color:#666;
}
.filebutton {
    content:'upload';
    font:small-caps 15px Georgia;
    letter-spacing:1px;
    border-radius:10px;
    border:1px solid #eee;
    width:100px;
    padding:10px;
    margin:20px;
    text-align:center;
    position:absolute;
    left:0;
    top:0;
    z-index:1;
    background-color:#f8f8f8;
}

.filebutton:hover {
    background-color:#f3f3f3!important;
    color:#c00;
     cursor : pointer;
}

它的工作...

于 2013-03-11T16:49:35.940 回答
1

文件输入是 IE 中的本机/ActiveX 组件,因此不能对它们执行事件 - 对于选择输入也是如此。

您真正需要双击做什么?

于 2013-03-11T16:48:26.897 回答
1

我知道我可能迟到了,但以防万一其他人偶然发现这篇文章,我能够用这个解决类似的问题:

$("#uploadInput").bind('mousedown', function (event) {
    $(this).trigger('click')
});

在 IE10 和 IE11 上工作。

于 2015-06-16T12:31:15.093 回答
0

我没有检查这个,但我想你需要使用这样的东西:

$('input').on('click', function() {
  $(this).trigger('dblclick');
});

我希望那不是愚蠢的,哈哈。

于 2013-03-11T16:47:12.960 回答
0

这是您的 CSS...如果您在 IE 中禁用不透明度和剪辑内容,您将看到实际的浏览按钮位于右侧。

确保在 IE9 中没有使用 filter:opacity,它对我有用。JSFiddle 在 IE7/8 中不起作用,所以我无法测试这些。

于 2013-03-11T16:56:20.120 回答
0
$("input").click(function() { 
    $(this).trigger('dbclick');
});
于 2013-03-11T16:44:20.397 回答