Question

当用户点击<input id="J_upload_btn" type="button" />按钮时，我希望弹出文件资源管理器，供用户选择文件。

然而，上述源仅适用于Firefox 4.在Chrome 11/12和Firefox 3上，只有在您多次单击按钮后才会弹出选择文件框。我的jQuery版本是1.5.2。

$('#J_upload_btn').click(function() {
    var _id = new Date().getTime(),
        _$form = $('#J_pic_form'),
        _$input = $('<input id="' + _id + '"' +
                  ' type="file" name="file" class="hide_input">');
    _$form.append(_$input);
    _$input.trigger('click');
    }
});

Answer 1

无与伦比的大括号。只是删除它应该工作。
在创建DOM树之前，您无法可靠地访问DOM元素。如果这个代码没有包装在一个函数中并且在那之后被调用，那么简单地将它包装在$(function(){ /* code */ });中就足以让jQuery在DOM准备好后立即调用它。
在某些浏览器（包括Firefox 3）中，触发<input type="file">元素上的点击事件为restricted for security reasons。

此代码适用于Chrome：

$(function() {
    $('#J_upload_btn').click(function() {
        var _id = new Date().getTime(),
            _$form = $('#J_pic_form'),
            _$input = $('<input id="' + _id + '"' +
                        ' type="file" name="file" class="hide_input">');
        _$form.append(_$input);
        _$input.trigger('click');
    });
});

Answer 2

这种输入比security issues更受限制。当然有更新的方法，但最常用的方法是使用不可见的输入（不透明度为0，不显示：无），并在其上放置一个假按钮，所以当你点击假按钮时，你'还要点击隐形输入。

Answer 3

您可能希望尝试不将输入包装为jayesh对象。如果您传递HTML字符串以追加，那么浏览器也应该添加一个新的输入字段。

var input = "<input id='"+id+"' />";
_$form.append(input);

另外，您是否尝试在控制台中调试单击以确保它被触发或后续代码出现问题？

Answer 4

如果您在输入上点击单击，则预计会运行一项功能。但据我所知，您还没有为_ $ input的点击事件编写任何函数。

jQuery.trigger（'click'）在我的代码中不起作用

4 个答案: