Posted in Javascript onSeptember 13, 2009
先列举一下Ajax在Jquery和prototype中的实现。
Jquery:
<script language="javascript"> $(function(){ var box = {}; var remoteUrl = 'index.php'; box.interval = 5*60*1000;//5分钟 box.showBoxInfo = function() { jQuery.get(remoteUrl, function(data){ var msg_box = $('#msg_box'); msg_box.innerHTML = data; } }); } box.run = function(){ this.showBoxInfo(); setInterval(this.showBoxInfo,this.interval); }; box.run(); }) </script>
prototype:
<script language="javascript"> var box = {}; box.interval = 5*60*1000;//5分钟 box.showBoxInfo = function(){ var pars = ""; var remoteUrl = 'index.php'; var myAjax = new Ajax.Request( remoteUrl, { method: 'get', parameters: pars, onComplete: box.showResponse }); }; box.showResponse = function(data){ var msg_box = $("msg_box") ; msg_box.innerHTML = data.responseText; }; box.run = function(){ this.showBoxInfo(); setInterval(this.showBoxInfo,this.interval); }; box.run(); </script>
实际在引入setInterval函数后prototype却不能刷新,这是为什么呢?
原来是prototype对于相同的URL有缓存机制,应此不能刷新页面,特别是在用户使用F5或点击“刷新”后,会出现Ajax响应区空白的bug,这样就必须让prototype不刷新。
对于prototype中的URL添加随机数
原:var remoteUrl = 'index.php';
修改后:var remoteUrl = 'index.php?rand='+Math.random();
使用GET方式产生一个与页面显示无关的参数即可。
prototype与jquery下Ajax实现的差别
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@