Javascript/Html文件上传input控件onchange在相同的文件下不触发的问题解决

2022-10-28 90点热度 0人点赞 0条评论

问题描述

Hmtl中有个如下的文件上传input控件,绑定了@change事件,在用户选择了文件后触发,来执行特定的业务逻辑

<input id="uploads" type="file" onchange="fileChanged(this)" accept="image/*">

<!--或者vue下的@change-->
<input id="uploads" type="file" @change="fileChanged" accept="image/*">

发现一个问题,在用户选择了A文件后,因为一些原因后,重新再选择A文件,这个时候,因为文件相同,导致没有触发@change,而我们希望只要选择了文件,都要触发@onchange

问题解决

只要在input的onclick下,清除下input file的值,让input认为我们是换了文件即可。代码如下:

<input id="uploads" type="file" onchange="fileChanged(this)" onclick="this.value=null;" accept="image/*">

 

 

admin

这个人很懒,什么都没留下

文章评论

您需要 登录 之后才可以评论