可能的重复: jQuery:从<input type= " file " />获取文件名

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

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

在这页下面还有一些文字

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

我想知道是否可以在文件输入框中选择文件名称进行文本更新?


当前回答

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

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

您可能希望向输入和span中添加id,以便可以根据这些id进行选择,以特定于您所关心的元素,而不是DOM中的其他文件输入或span。

其他回答

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

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

您可能希望向输入和span中添加id,以便可以根据这些id进行选择,以特定于您所关心的元素,而不是DOM中的其他文件输入或span。

我建议你试试改变项目。测试它是否有值,如果有,你就可以继续你的代码。jQuery已经

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

Or

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

它们是等价的。

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

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