jQuery - 检测文件输入中是否已选择文件

时间:2011-04-14 23:13:32

标签: jquery

  

可能重复:
  jQuery: get the file name selected from <input type=“file” />

我有一个标准的文件输入框

<input type="file" name="imafile">

我在页面上也有一些文字,如此

<span class="filename">Nothing selected</span>

我想知道是否可以使用文件输入框中选择的文件名更新文本?

干杯,

2 个答案:

答案 0 :(得分:297)

您应该能够将事件处理程序附加到输入的onchange事件,并让该函数调用一个函数来设置跨度中的文本。

<script type="text/javascript">
  $(function() {
     $("input:file").change(function (){
       var fileName = $(this).val();
       $(".filename").html(fileName);
     });
  });
</script>

您可能希望在输入和范围中添加ID,以便根据您所关注的元素进行选择,而不是DOM中的其他文件输入或跨度。

答案 1 :(得分:11)

我建议尝试更改活动?测试它是否有值,如果它有,那么你可以继续你的代码。 jQuery有

.bind("change", function(){ ... });

或者

.change(function(){ ... }); 

是等价的。

http://api.jquery.com/change/

对于唯一选择器,将您的name属性更改为id,然后将jQuery("#imafile")或一般jQuery('input[type="file"]')更改为所有文件输入