如何使用文件上传显示文件名

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

你可以这样做：

$("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()); 
}); 

FIDDLE

Answer 2

如果你只需要在文件名：

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