美文网首页
解决input[type="file"]chang事件不能触发的

解决input[type="file"]chang事件不能触发的

作者: AAA前端 | 来源:发表于2019-07-11 18:26 被阅读0次
  • app里面嵌套h5页面,有个input[type='file']的标签实现用户手机拍照功能
<input style="position:absolute;opacity:0;"  type="file"  id="Album_img" accept="image/*" capture="camera" multiple/>
  • 在js里面处理图片
$('#Album_img').on('change', function (e) {
  var formData = new FormData();  
  var file = $('#Album_img').get(0).files[0]
  formData.append('file', file);
  // 调用函数,对图片进行压缩上传
  compress(file, 'idCardFront');
})

但是在安卓上第二次点击input按钮的时候没有获取的新图片,ios没问题。最后一点点排查,发现没有触发change事件

  • 既然知道问题所在,那就好办了。在每次处理的时候把input清空就行。(由于是移动端,所以没有处理ie的兼容问题)
$('#Album_img').on('change', function (e) {
  var formData = new FormData();
  
  var file = $('#Album_img').get(0).files[0]
  formData.append('file', file);
  // 调用函数,对图片进行压缩上传
  compress(file, 'idCardFront');
  // 重置
   $(this).val('')
})
  • 解决了需求。。。。。 (吐槽一下公司网路,百度打开都要7、8秒钟,ε=(´ο`*)))唉)

相关文章

网友评论

      本文标题:解决input[type="file"]chang事件不能触发的

      本文链接:https://www.haomeiwen.com/subject/uyfjkctx.html