我可以在表单输入[type="file"]中通过单击触发双击吗?

Can I trigger a double click with a single click in a form input[type="file"]?

本文关键字：quot 单击 双击 file 输入 表单 type 我可以      更新时间：2023-09-26

我有一个用于提交文件的表单input，我对它进行了样式设计，因为我不喜欢本地样式。现在，我有了一个按钮，当点击它时，它会打开对话框来选择文件。在Firefox和Chrome上点击一下就可以了，但在IE上不行。按钮需要双击打开IE中的对话框。

我试过用jQuery触发一个双击:

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

然而，它似乎不起作用。还有其他的方法来触发IE的双击吗?

下面是演示:http://jsfiddle.net/HAaFb/

这样怎么样:

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

我发现jQuery文件上传演示页面实际上重新定位了文件输入字段(虽然"隐藏")，以便浏览按钮可以很好地位于"添加文件"按钮的区域内。所以当你在ie8/9/10中点击这个按钮时，只需点击一下它就会打开。

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

在我看到的一个CSS中:

.fileinput-button input {
...
right: 0px;
...
transform: translate(300px, 0) scale(4);
}

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

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

在你的小提琴，我这样做:

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

I try this

$('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;
}

文件输入是IE中的原生/ActiveX组件，因此不能对其执行事件-对于选择输入也是如此。

你到底需要双击做什么?

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

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

在IE10 &IE11 . 

$("input").click(function() { 
    $(this).trigger('dbclick');
});

我还没有检查过这个，但我想你会需要使用这样的东西:

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

我希望这不是愚蠢的，哈哈

这是你的CSS…如果你在IE中禁用不透明度和剪辑，你会看到实际的浏览按钮在右边。

确保在IE9中没有使用filter:opacity，这个对我来说是有效的。JSFiddle不能在IE7/8中工作，所以我无法测试这些

相关文章：