Question

我隐藏input["type"]样式“浏览文件”按钮。

<input type="file" id="photoUpload" multiple style="display: none"/>

<button class="addFile" id="fakePhotoUpload">&nbsp;</button>

我尝试通过jQuery函数点击隐藏的input["type"]

$('#fakePhotoUpload').click(function() {
    $('#photoUpload').click();
});

此代码执行并像魅力一样工作。

但是，如果我称之为功能

$('#photoUpload').click();

来自浏览器控制台（谷歌浏览器）没有任何反应。

谁可以解释控制台的这种行为？

Answer 1

这是出于安全目的，您无法打开浏览器文件对话框没有任何用户交互，在您的示例中，点击页面上的任何位置。

如果可以，那就应该紧急修复！

Answer 2

这不是解决方案，但非常有用：

jQuery(function ($) {
    $('#fakePhotoUpload').click(function () {
        $('#photoUpload').click();
    });
    $('#photoUpload').click(function(e){
        alert('hi');//make your own dialog box here. use UI dialog box.
    });
    $('#photoUpload').click();
})

fiddle

浏览器控制台和jQuery功能的奇怪行为

2 个答案: