解決AJAX.load()在IE無法成功更新


這個問題其實就是IE會比較笨不會去重新載入url或file, 而是去讀cache的資料!
同樣的情形並不會發生在firefox與chrome等其他瀏覽器, 他們都會很聰明的自動更新!
但由於IE仍有50%以上的使用市佔率, 所以還是得改呀! 大家應該不會跟客戶過不去吧

以下為我找到的解法其實很簡單! 只是我最近試過更多無效的方法, 像加入meta no cache 之類的.
或是
header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date in the past

下面是我試過可以work的方式!

IE浏览器下Ajax缓存有问题,好像不刷新。我的网站页面上有一块区域用来显示一对多关系中的“多”,比如一个用户组下的几个用户。我希望用Ajax把用户的所有操作都放在这一个区域里面完成:
a.添加和编辑都使用ThickBox这种弹出层来完成;
b.删除、锁定都使用Ajax;
但是有一个问题是这些操作完成之后如何不刷新就能更新数据,所以我用了Jquery.load()方法。东西是写出来了,但是发现在IE浏览器下并没有想象的那么好用,可能是缓存的问题。

专门写一个函数来生成一个和页面区域样式一样的页面。每次更新完之后都通过Ajax来load这个函数来替换当前页面的相同区域。
这样的做的好处是可以每次显示的数据都是真实的,逻辑完全是通过PHP后台完成然后显示在页面,这样就不用考虑比如添加第一个用户和删除了最后一个用户这样的特殊情况,这种逻辑在php函数中已经完成。我之前的做法是用js来局部更新有改动的项,比如删除就是在后台运行完返回成功结果后把那一行隐藏掉,这样就会有我之前提到的那些特殊情况。
坏处就是每次执行一个操作就会把整个显示用户区域的数据都重新取一次,稍微的浪费了一些资源。
本文的重点不是说如何加载Ajax,而是想说一下在IE下面,刚才所说的jQuery.load()并没有很好的执行,经测试发现添加第一个用户的时候没问题,再加新用户或编辑用户的时候不会刷新。仔细比较之间的区别,第一次执行,这个Ajax读取的地址是新的,再添加或编辑,Ajax读取的地址没变,所以肯定是IE的缓存搞的鬼。它判断Ajax请求的地址在缓存中有记录,就把那一次的记录拿出来给我用。。。但firefox显然没这么傻。
解决也很简单,在每次调用Jquery.load()方法时,里面的url加一些随机数就可以了,比如:

var a = Math.random();
$('somediv').load(url+'?rand='+a);
//That’s OK!


http://www.iefans.net/ie-ajax-shuaxin/

分類: 未分類

發表迴響