使用 javascript/jquery 触发文件上传对话框

而不是使用<input type="file">，是否可以使用<input type="text">然后使用 javascript 或 jquery 编写脚本，这样当单击文本框时，就会显示文件上传对话框......（并在提交到表单时实际上传）

你的意思是这样的吗？

http://jsfiddle.net/CSvjw/ http://jsfiddle.net/CSvjw/

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

$('input[type=file]').change(function() {
    $('input[type=text]').val($(this).val());
});

但请注意，出于安全原因，文件输入给出的值是假的。如果您只想显示文件名，可以剪掉斜杠。

下面是如何使用字符串分割和数组弹出来完成此操作的示例：

http://jsfiddle.net/CSvjw/1/ http://jsfiddle.net/CSvjw/1/

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

$('input[type=file]').change(function() {
    var vals = $(this).val(),
        val = vals.length ? vals.split('\\').pop() : '';

    $('input[type=text]').val(val);
});

您可以进一步调整此设置以适应使用正斜杠作为目录分隔符的系统。同样重要的是要注意，如果这样做，您将失去许多现代浏览器的功能，用户可以将文件从计算机直接拖动到文件输入上。如果我是你，我会通过设计文件输入的样式来接受这种范例，而不是试图将文本输入变成它不是的东西。