prototype与jquery下Ajax实现的差别


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方式产生一个与页面显示无关的参数即可。
Javascript 相关文章推荐
用JavaScript调用WebService的示例
Apr 07 Javascript
Jquery 表单验证类介绍与实例
Jun 09 Javascript
javascript预加载图片、css、js的方法示例介绍
Oct 14 Javascript
关于jquery的多个选择器的使用示例
Oct 18 Javascript
javascript上下方向键控制表格行选中并高亮显示的方法
Feb 13 Javascript
jQuery实现的导航下拉菜单效果
Jul 04 Javascript
JS实现点击事件统计的简单实例
Jul 10 Javascript
浅谈node中的exports与module.exports的关系
Aug 01 Javascript
Node.js+jade+mongodb+mongoose实现爬虫分离入库与生成静态文件的方法
Sep 20 Javascript
vue中多个倒计时实现代码实例
Mar 27 Javascript
微信小程序修改checkbox的样式代码实例
Jan 21 Javascript
Vue+scss白天和夜间模式切换功能的实现方法
Jan 05 Vue.js
JS 参数传递的实际应用代码分析
Sep 13 #Javascript
javascript类继承机制的原理分析
Sep 12 #Javascript
javascript 类定义的4种方法
Sep 12 #Javascript
一个简单的javascript类定义例子
Sep 12 #Javascript
一个简单的JavaScript 日期计算算法
Sep 11 #Javascript
关于javascript 回调函数中变量作用域的讨论
Sep 11 #Javascript
javascript 一些用法小结
Sep 11 #Javascript
You might like
PHP常见漏洞攻击分析
2016/02/21 PHP
JavaScript null和undefined区别分析
2009/10/14 Javascript
Jquery工作常用实例 使用AJAX使网页进行异步更新
2011/07/26 Javascript
javascript中取前n天日期的两种方法分享
2014/01/26 Javascript
jquery实现的用户注册表单提示操作效果代码分享
2015/08/28 Javascript
JavaScript中的Array 对象(数组对象)
2016/06/02 Javascript
Javascript之面向对象--接口
2016/12/02 Javascript
详解webpack介绍&amp;安装&amp;常用命令
2017/06/29 Javascript
Vue Router的懒加载路径的解决方法
2018/06/21 Javascript
原生JS检测CSS3动画是否结束的方法详解
2019/01/27 Javascript
Vue.js实现大转盘抽奖总结及实现思路
2019/10/09 Javascript
jquery html添加元素/删除元素操作实例详解
2020/05/20 jQuery
原生JavaScript实现刮刮乐
2020/09/29 Javascript
[03:59]DOTA2英雄梦之声_第07期_水晶室女
2014/06/23 DOTA
[53:38]OG vs LGD 2018国际邀请赛淘汰赛BO3 第三场 8.26
2018/08/30 DOTA
举例讲解Python的Tornado框架实现数据可视化的教程
2015/05/02 Python
python编写爬虫小程序
2015/05/14 Python
wxpython实现图书管理系统
2018/03/12 Python
python ubplot使用方法解析
2020/01/10 Python
python缩进长度是否统一
2020/08/02 Python
CSS3 选择器 伪类选择器介绍
2012/01/21 HTML / CSS
css 省略号 css3让多余的字符串消失并附加省略号的实现代码
2013/02/07 HTML / CSS
CSS3 transforms应用于背景图像的解决方法
2019/04/16 HTML / CSS
HTML5边玩边学(2)基础绘图实现方法
2010/09/21 HTML / CSS
详解HTML5如何使用可选样式表为网站或应用添加黑暗模式
2020/04/07 HTML / CSS
行政管理专业推荐信
2013/11/02 职场文书
电气技术员岗位职责
2013/11/19 职场文书
旅行社各个岗位职责
2014/03/15 职场文书
校园联欢晚会主持词
2014/03/17 职场文书
部队反四风对照检查材料
2014/09/26 职场文书
2014年最新离婚协议书范本
2014/10/11 职场文书
2014年反腐倡廉工作总结
2014/12/05 职场文书
2014年扶贫帮困工作总结
2014/12/09 职场文书
坎儿井导游词
2015/02/09 职场文书
2016年度创先争优活动总结
2016/04/05 职场文书
Windows server 2022创建创建林、域树、子域的步骤
2022/06/25 Servers