jquery:在input:file上触发click()?

时间:2011-06-15 13:14:49

标签: jquery events file-upload click

我正在尝试使用此reference在我的网站上重新设置(eclipse)fileupload元素。当我将fileupload元素放在我的新替代图像下面时(按照前面提到的教程中的说明),一切都很好,结果很有希望。现在,我想将fileinput元素放在其他位置,并将图像上的单击函数绑定到单击fileinput元素以触发文件浏览器对话框。

唉,通常的$('input:file').click()$('input:file').trigger('click')无效。

我也对发布文件对话框的其他方法感兴趣,没有文件上传元素(它仅用于javascript处理,不上传到服务器)。

哦,它不需要在任何版本的IE上工作。

3 个答案:

答案 0 :(得分:5)

错过两个代码示例的引用,请尝试$('input:file').trigger('click') 但是,据我所知,至少这种方式不可能做到这一点。这是出于设计的目的,出于安全问题的目的。

您可以尝试通过跟踪鼠标移动并将隐藏文件输入移动到新图像的顶部或用于设置输入样式的任何内容来实现。

答案 1 :(得分:3)

你现在怎么做,你能给我们一些代码吗?还可以尝试向文件输入和要触发的字段添加唯一ID。例如:

<span id="browse">Click here to choose a file</span>
<input type="file" id="file" />

然后尝试:

$('#browse').bind('click', function(e) {
  $('#file').click();
});

答案 2 :(得分:0)

<div class="imageUploadInput">
    <img id="uploadImage" src="images/camera_icon.png" />
    <input type="file" name="thumb" id="uploadImageInput" />
</div>

jQuery的:

$('#uploadImage').livequery("click",function(){
    $('#uploadImageInput').trigger('click');
});

$('#uploadImage').click(function(){
   $('#uploadImageInput').trigger('click');
});