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

时间:2013-04-25 11:03:34

标签: javascript jquery html css3

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

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

我该怎么做?

2 个答案:

答案 0 :(得分:4)

如果您只需要文件名:

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

答案 1 :(得分:4)

你可以这样做:

$("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