您的位置:首页 > Web前端 > HTML

万恶IE兼容之input change事件

2017-12-29 15:21 127 查看
在做多文件上传时,给input添加change事件,触发AJAX请求,通过formdata进行上传,直到这里都比较中规中矩,高高兴兴获取dom,绑上事件,在chrome,firefox等完美运行~  结果上午刚弄好,下午测试提bug,上传文件有问题,跑过去一看,原来是上传进度条读满以后,该弹层傲娇矗立,坚挺不退,根据表现定位问题到弹层的打开上,打上两个断点,chrome和IE 双开运行。
    果然,chrome小乖乖听话,跑一圈老实听话回家,IE这狗贼,跑完一遍不愿回家,野驴一样又溜了一圈,结果就导致了上传成功关闭弹层后又打开了,且因上传已成功后被我阻断进程,就滞留了下来。
    为啥会跑两次呢,原来IE中给input加change事件会被js的操作给触发,而多文件上传时在上传成功后置空了input的值,该操作被认为input值发生了改变,导致change再次触发,知道了原因  接下来就好办了。首先,置空操作干掉,通过删除节点再添加模拟置空,避掉了ie的鬼规矩,另外不要忘了动态添加节点普通绑定事件不可用,我这里用的JQ,用on方法进行事件绑定。至此,两个孩子一起高高兴兴出门,同时快快乐乐回家,完美~
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html 兼容 ie6