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 相关文章推荐
关于URL中的特殊符号使用介绍
Nov 03 Javascript
js带按钮的提示框可供选择示例代码
Sep 17 Javascript
node.js中的fs.chownSync方法使用说明
Dec 16 Javascript
javascript面向对象之this关键词用法分析
Jan 13 Javascript
Jquery幻灯片特效代码分享--鼠标点击按钮时切换(1)
Aug 15 Javascript
jQuery实现点击查看大图并以弹框的形式居中
Aug 08 Javascript
javascript 实现文本使用省略号替代(超出固定高度的情况)
Feb 21 Javascript
vuejs绑定class和style样式
Apr 11 Javascript
mpvue+vant app搭建微信小程序的方法步骤
Feb 11 Javascript
详解用async/await来处理异步
Aug 28 Javascript
解决vue+ element ui 表单验证有值但验证失败问题
Jan 16 Javascript
微信小程序实现锚点跳转
Nov 23 Javascript
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
Cannot modify header information错误解决方法
2008/10/08 PHP
php 全局变量范围分析
2009/08/07 PHP
PHP中exec与system用法区别分析
2014/09/22 PHP
php开发微信支付获取用户地址
2015/10/04 PHP
用HTML/JS/PHP方式实现页面延时跳转的简单实例
2016/07/18 PHP
javascript hashtable实现代码
2009/10/13 Javascript
Javascript new Date().valueOf()的作用与时间戳由来详解
2013/04/24 Javascript
jquery mobile的触控点击事件会多次触发问题的解决方法
2014/05/08 Javascript
原生js实现日期联动
2015/01/12 Javascript
jQuery中on()方法用法实例详解
2015/02/06 Javascript
JS实现在状态栏显示打字效果完整实例
2015/11/02 Javascript
jquery的ajax提交form表单的两种方法小结(推荐)
2016/05/25 Javascript
Javascript中函数名.length属性用法分析(对比arguments.length)
2016/09/16 Javascript
[js高手之路]寄生组合式继承的优势详解
2017/08/28 Javascript
vue+node+webpack环境搭建教程
2017/11/05 Javascript
原生JavaScript实现的简单放大镜效果示例
2018/02/07 Javascript
微信小程序实现购物页面左右联动
2019/02/15 Javascript
js/jquery遍历对象和数组的方法分析【forEach,map与each方法】
2019/02/27 jQuery
[01:02:09]Liquid vs TNC 2019国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21
2020/07/19 DOTA
python 实现堆排序算法代码
2012/06/05 Python
python基于twisted框架编写简单聊天室
2018/01/02 Python
对python中的logger模块全面讲解
2018/04/28 Python
Python简单实现网页内容抓取功能示例
2018/06/07 Python
Python面向对象之私有属性和私有方法应用案例分析
2019/12/31 Python
python中K-means算法基础知识点
2021/01/25 Python
全球性的在线时尚男装零售商:boohooMAN
2016/12/17 全球购物
香港百佳网上超级市场:PARKNSHOP.com
2020/06/10 全球购物
教师个人鉴定材料
2014/02/08 职场文书
企业领导对照检查材料
2014/08/20 职场文书
计划生育证明格式范本
2014/09/12 职场文书
学校运动会报道稿
2014/09/23 职场文书
2014年医德医风工作总结
2014/11/13 职场文书
2014年工人工作总结
2014/11/25 职场文书
避暑山庄导游词
2015/02/04 职场文书
python中 .npy文件的读写操作实例
2022/04/14 Python
python APScheduler执行定时任务介绍
2022/04/19 Python