上传图片删除后,不能上传同一张图片的解决方法

js上传一张图片后, 删除后, 不能再次上传该图片, 用户体验不是很好
<div class="uploader-input-box">
    <input class="uploader-input" id="uploader-input" name="imgurl" type="file">
</div>

解决方式
  修改input的value值
$('#uploader-input').val('');

为什么会出现这种问题
  1.我们在上传图片时,监听的是$(#uploader-input)的change事件;
  2.change事件会在内容改变且失去焦点时触发;
  3.第二次上传的图片还是上一次的图片的话,就不会触发这个onchange事件,从而导致图片上传失败



vue
<div ref="update" class="uploader-input-box">
    <input class="uploader-input" id="uploader-input" name="imgurl" type="file">
</div>

this.$refs.update2.value = ''
 
posted @ 2020-03-17 18:05  郑正正  阅读(689)  评论(0编辑  收藏  举报
Live2D