IE11 粘贴数据用AJAX提交老是失败
最近做的项目中有这么一项功能:从Excel里面赋值数据,粘贴到页面里面的input框里。当然,这些input框也可以接收手动输入的数据。这项功能原本没什么问题,在IE(6、7、8、9、10)、狐火两大系列都没有问题。后来微软发布了IE11,客户那边也自动更新成了IE11,此时在录入数据的时候就开始报错,根本就录不进去,也没错误提示。用debug查看的时候,发现根本就没有进入AJAX指定的URL代码,而是直接就往error函数里面跑了,查看Error的参数,发现此时readyState=4(已完成),status=0(未初始化),是在不明白怎么会出现这种情况。以为是JQuery的问题,就手动录入了一个数据,发现手动录入的没问题,就排除了Jquery的嫌疑。
没法,用最原始的AJAX,创建xmlHttp对象,然后open,send。再次运行的时候发现,代码一运行到open就开始报错:拒绝访问。去网上查,说“拒绝访问”多半是跨域的问题,可是我的项目从头到尾都只是在本地运行根本就不存在跨域问题啊,再说了要说跨域,手动输入的时候怎么不报错呢,为以防万一,还特意处理了跨域的问题,结果还是拒绝访问。看来不是跨域的问题啊。
后来朋友提醒我说,他上次弄一个功能,也出现这中状况,有些可以保存成功,有些不可以,他当时给Ajax的代码加了个延迟setTimeout,问题就解决了,让我也试试。我就死马当活马医了,抱着试试看的心态开始试,当时他用的是火狐(更准确点是HTML5),我用的是IE11(也是HTML5),两者可能有关系。
然后写了代码,开始测试,手动录入一直没问题,从Excel上复制一个数据粘贴上午,嘿,竟然能保存。有苗头。我就复制了3个,以为可以保存3个,结果却只保存了一个,我还以为是setTimeout的关系呢,因为网上不是说setTimeout只执行一次啊。一个意外,我复制完了数据直接把页面关了,再次打开时,发现一个数据都没存上,嘿,这不对啊,至少的存一个啊。后来发现,其实存上去的那个数据,不是因为粘贴后存上的,而是粘贴完了鼠标移开的时候出发了onblur事件,这个数据是onblur事件存上去的。为了验证,我粘贴完了,在每个input框里点了一下,果不其然,三个数据都存进去了,怪不得呢,每次复制了三个存进去的永远都是最后那一个。
这个怪了啊,我明明延迟了,它应该延迟了规定的时间之后再开始执行啊。于是,接着DEBUG。(这里需要说明一点,我从Excel上复制的数据可能会有很多行很多列,通过处理之后,弄成了一行一行的数据,然后再对每一行for循环,循环出一个一个的数据,每循环一个,调用相应方法进行保存。)发现代码运行到setTimeout时,代码根本就不会等0.01秒(我设的延迟时间为0.1秒)而是直接略过方法接着往下循环,那个方法下面的代码也不执行了,到最后保存数据的方法一次都没执行。我的数据自然就一个都没保存上。
这是个什么情况啊,网上查,说让for循环sleep根本就不可能,它最多是直接略过也不会等。大家都知道,JS里面有没有sleep方法,这可咋整啊!嘿,for循环不能,我到那个方法(方法名:saveData)里面暂停总行吧!然后把Ajax执行的那个代码提炼成一个方法(ajaxFun(param1,param2)),在saveData里面加上setTimeout("ajaxFun("+param1+","+param2+")",10),然后复制三条数据测试。原本以为绝对能成功呢,但事与愿违啊,结果跟放在for循环一样的,什么都没存上。这是个什么情况。觉得可能是setTimeout("ajaxFun("+param1+","+param2+")",10)方法格式写错了,换成单引号,结果还是有问题。于是我火了,我不提出来了,我直接function,setTimeout(function(){Ajax代码},10),然后再执行,终于好了。哎,折腾的我啊!
然后我去测试其他的输入情况,发现又保存不了了,什么情况,F12,查看JS,发现里面的JS竟然是先前的(就是setTimeout("ajaxFun("+param1+","+param2+")",10)的样子),于是清除历史记录,再测试,还是一样。重启浏览器,结果依旧。没办法了,直接重启服务器,再查,代码终于改过了了,执行也成功了。哎,这IE11的缓存太牛X了。
综合以上可以得出至少两个结论:
1、IE11在处理多数据时,可能会晕,然后报莫名其妙的错,你得刻意让它慢下来,一个一个来,否则出了问题都不知道问题出在哪儿。
2、IE11的缓存真的很牛X,用它自带的“删除浏览的历史记录”(我是勾选了上面所有的选项)都不是很管用,哎,这孩纸不好管啊!
以上我弄这个问题的具体过程和得出的结论,充满了艰辛啊。虽然走了很多弯路,但也确实是学了不好东西!就把这个写下来吧,帮助我自己也帮助可能用得着的朋友吧!
相关推荐
结束数据方法的参数,该如何定义?-- 集合为自定义实体类中的结合属性,有几个实体类,改变下标就行了。<input id="add" type="button" value="新增visitor&quo