解决input file change文件上传只执行一次

已于 2022-03-24 09:11:29 修改
阅读量934 收藏
点赞数 1
文章标签： vue.js javascript html
于 2022-03-23 16:44:21 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/China_Edc/article/details/123689704
版权

这样写的。

出现bug的情况是：

当我点开一个上传文件的时候可以正常上传，点开第二个的时候如果是上传相同的东西，

则上传页面什么都不显示。如果换一个文件就可以。

原因可能是因为@change的event没有发生改变，所以没有上传成功，我们需要把file的值清空，操作如下：

3.24出现的bug 

发现一个问题，就是不能上传相同的文件，而且不能上传比上次文件小的文件，原来是我记录文件的uploadIndex没有重置，不重置的话，下次for循环遍历文件的时候还是会用这个index的

China_Edc
关注
html input的file文件输入框onchange事件触发一次失效解决方法
weixin_33943347的博客
11-16 702
最近在做一个图片上传的功能，出现提交一次后，file输入框的change事件无法再次触发的bug，就是说提交一次后必须刷新才能再次提交，这就坑了~ 于是想办法解决它~ 在网上找了一些资料，找到这几种方法： 1、替换掉原来的input框2、remove原来的input框，然后在添加进新的一样的input框 我测试了之后发现可以用下面的方法解决这个问题：第一步：上传完成后替换掉原来的input...
修改input file 原始样式，img标签/button覆盖原始上传样式，input file @change传值
吾行远方
04-29 2989
修改input file 原始样式，img标签/button覆盖原始上传样式，input file @change传值input file 原始样式很丑，实际使用中需要将其修改为符合当前项目的风格，本文以上传图片为例个人项目效果，红色框中的就是按钮，点击后调用摄像头或者本地文件夹上传 证件照片，后台处理返回结果前端自动反写input file 原始样式效果如下：img标签覆盖原始上传文件样式CSS...
解决vue项目中type=”file“ change事件只执行一次的问题
08-27
主要介绍了vue项目中解决type=”file“ change事件只执行一次的问题,本文给大家介绍的非常详细，需要的朋友可以参考下
解决使用input file change文件上传只执行一次
misMa_anran的博客
09-20 871
解决使用input file change文件上传只执行一次
使用input上传文件 change事件只能执行一次的问题解决
你的阿迁
05-10 651
由于一直选择的是同一个文件，不能够让change事件的event.target.value发生改变，导致选择文件后，不会再次触发change事件。一开始我选择在change事件的回调函数中，对文件的内容进行置空，由于还需要对已上传的文件进行查看，导致获取不到所选择的文件数据，我又重新在关闭弹层的时候，通过ref将内容置空。关闭弹层后，再次选择文件时（由于当时在测试，一直选择的都是同一个文件），input的change事件不执行，弹层也就顺理成章地打开不了。点击批量上传按钮，选择文件后，弹层正常显示。
Input type="file"上传文件change事件只触发一次解决方案
LGQ943592312的博客
11-24 1384
一、刚开始用法 $(function () { $("#file").change(excelUpload); }) excelUpload()函数内部就是提示是否确认上传动作，一开始这样写只有在第一次选择上传文件的时候触发了excelUpload函数，显然这样是不行的。后来网上有人说缓存live事件，直接报错，原因是Juqery1.9版本以上已经废弃了该方法，换...
上传文件的input框的change时间只能触发一次的原因
守护大白菜的博客
12-22 1万+
用 ajaxfileupload上传文件没有问题，但是只能触发一次change事件
jquery(live)中File input的change方法只起一次作用的解决办法
10-28
在jQuery中，File input的`change`事件是一个非常常见的用于监听用户选择文件后触发的事件。然而，在某些情况下，开发者可能会遇到`change`方法只触发一次的问题，这通常是由于元素的动态添加或DOM结构更新导致的。...
将input file的选择的文件清空的两种解决方案
12-12
上传文件时,选择了文件后想清空文件路径，搜索了一下，用两种方法解决 代码如下: <input type=”file” id=”fileupload” name=”file” /> 第一种: 代码如下: var obj = document.getElementById(...
<input type="file">设置的onchange只能执行一次的解决方案
日拱一卒，功不唐捐
02-27 7439
<input type="file">设置的onchange只能执行一次的解决方案
解决input file文件chang事件只触发一次问题
huzheaccp的专栏
10-11 4262
$("#file1").live('change',function(){imageFormSubmit("1");}); 注意  file文件上传，必须设置file文件的name 属性
【Django】bootstrap fileinput上传多图，后台只收到一张
winrh的博客
11-28 833
问题描述 用bootstrap fileinput上传多张图，显示没问题，但提交后，后台接口只能收到最后一张图片。 解决方法 1. 确保你的input标签没问题： <input id="myFile" type="file" class="file" name="myFile[]" multiple="multiple" /> 2. 初始化组件： $("#myFile").fileinput({ uploadUrl: '/importUrl/', .
解决(jq)input file 的change事件只生效一次的问题(个人笔记)
Mr.liu08
04-11 1981
本人小白啊，项目过程中遇到这个这个问题后一脸懵逼呢，然后百度了一下发现了好多人都遇到过这个问题，然后本人就拿了百度上大佬们贴出的代码试了试，发现没有解决我的问题，关键是越往后搜资料吧大家贴出来的解决方案基本是一致的，就是下面这个解决方案： 解决方法1：用jQuery的live代替直接使用change。 错误代码： $("#fileToUpload").change(function(){ //do...
input type="file" 的onchange事件
热门推荐
newnazi的专栏
03-05 1万+
onclick="return FileUpload_onclick()" onchange="return FileUpload_onselect()"/>                function FileUpload_onselect()         {             var path;             path=document.forms[0].
解决input的type=“file“时，在上传同一文件/图片@change不进行二次触发的问题
最新发布
m0_50298323的博客
11-14 834
解决input的type=“file“时，在上传同一文件/图片@change不进行二次触发的问题
解决Vue中 input type=file上传后@change事件无效的问题
代码研究院
06-16 1万+
为什么@change事件会无效？ 绑定事件无效的问题，不仅仅是Vue中才会出现的，写原生js时同样是上传完文件后将无法触发事件，简单查阅资料，似乎与上传的DOM组件相关，因项目紧急也没有深究。 怎么解决事件不触发的问题？ 网上大多文章说是要移除<input type='file' id='demo'\>再通过JS动态添加，这样确实可以解决问题，vue 中也有很多文章说 通过 v-if ,我试过之后发现v-if也不生效了 借助jQuery重新绑定事件,可以解决 $("#demo").off("ch
html input file onchange,file input控件onchange事件只生效一次
weixin_35858450的博客
06-11 315
.cropit-preview{background-color: #f8f8f8;background-size: cover;border: 1px solid #ccc;border-radius: 3px;margin-top: 7px;width: 28px;height: 28px;}function change(obj){console.log("change");/*解决上传相同...
Vue2中input:file的change事件相同文件只会触发一次
10-27 1277
如果用户选择相同的文件，事件不会再次触发，因为浏览器认为文件没有更改。
图片上传时input file change事件多次触发解决
人生代码 ---- 公众号
04-22 1908
解决图片上传预览多次触发问题
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值