如何在jQuery中获取动态文件输入字段值？

Question

我正在开发一个可以进行多个文件上传的Web应用程序。

当用户点击加号按钮时，我会附加一个新的输入字段。

然后，用户从文件中选择图像。我想验证该图像，如果发现任何错误，则需要显示该消息并停止表单操作。

但是现在更改事件无法使用我的代码。

这是我的代码..

HTML

 <span class="input-group-addon btn btn-Choose btn-file">
  <span class="fileinput-new">Browse File</span>
  <span class="fileinput-exists">Change</span>
  <input class="fileimgval" type="file" name="brchrimg[]">
 </span>

动态HTML （与上方相同）

<span class="input-group-addon btn btn-Choose btn-file">
  <span class="fileinput-new">Browse File</span>
  <span class="fileinput-exists">Change</span>
  <input class="fileimgval" type="file" name="brchrimg[]">
 </span>

获取文件信息的脚本...

$(document).on('change','.fileimgval',function(){
      alert($(this).val());
 });

静态HTML文件输入和动态输入字段没有触发事件。

我正在使用Jquery 1.11.1

 <script src="../assets/global/plugins/jquery/jquery-1.11.1.min.js"></script> 

错误是什么？

控制台中没有错误消息......

Answer 1

请改用它，当您单击文件上传时会触发

$(document).on('click','.fileimgval',function(){ alert($(this).val()); });

但是当你点击文件上传按钮时它就会触发，无法验证图像。您应该使用此插件来更清洁地完成此操作，否则您将搞乱所有内容。

https://blueimp.github.io/jQuery-File-Upload/

它很简单，并且具有良好的用户界面。