javascript - 如何通过文件上传显示文件名

Question

我想在上传文件时显示文件名。为此，我使用了隐藏字段。我的代码是

<label>File</lable>
<input type="image" src="http://upload.wikimedia.org/wikipedia/commons/c/ca/Button-Lightblue.svg" width="30px"/>
<input type="file" id="my_file" style="display: none;" />

javascript是

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

我怎样才能做到这一点？

Answer 1

如果您只需要文件名：

$('#my_file').change(function(){
    var filename = $(this).val().split('\\').pop();
});

Answer 2

你可以这样做：

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

$("input[id='my_file']").change(function (e) {
    var $this = $(this);
    $this.next().html($this.val().split('\\').pop());
});

小提琴