prototype與jquery下Ajax實現(xiàn)的差別
更新時間：2009年09月13日 21:28:56 作者：
Ajax技術(shù)在web中應(yīng)用的相當(dāng)廣泛,最近項目需要用到Ajax，由于主站所用的是Jquey，而某個欄目的開發(fā)用的是prototype，這樣一來就必須對JS代碼做調(diào)整了。
先列舉一下Ajax在Jquery和prototype中的實現(xiàn)。
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函數(shù)后prototype卻不能刷新，這是為什么呢？
原來是prototype對于相同的URL有緩存機制，應(yīng)此不能刷新頁面，特別是在用戶使用F5或點擊“刷新”后，會出現(xiàn)Ajax響應(yīng)區(qū)空白的bug，這樣就必須讓prototype不刷新。
對于prototype中的URL添加隨機數(shù)
原：var remoteUrl = 'index.php';
修改后：var remoteUrl = 'index.php?rand='+Math.random();
使用GET方式產(chǎn)生一個與頁面顯示無關(guān)的參數(shù)即可。
Jquery：
復(fù)制代碼 代碼如下:
<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:
復(fù)制代碼 代碼如下:
<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函數(shù)后prototype卻不能刷新，這是為什么呢？
原來是prototype對于相同的URL有緩存機制，應(yīng)此不能刷新頁面，特別是在用戶使用F5或點擊“刷新”后，會出現(xiàn)Ajax響應(yīng)區(qū)空白的bug，這樣就必須讓prototype不刷新。
對于prototype中的URL添加隨機數(shù)
原：var remoteUrl = 'index.php';
修改后：var remoteUrl = 'index.php?rand='+Math.random();
使用GET方式產(chǎn)生一個與頁面顯示無關(guān)的參數(shù)即可。
您可能感興趣的文章:
- 找到了一篇jQuery與Prototype并存的沖突的解決方法
- 解析prototype,JQuery中跳出each循環(huán)的方法
- jquery與prototype框架的詳細對比
- jQuery.fn和jQuery.prototype區(qū)別介紹
- 解析jQuery與其它js(Prototype)庫兼容共存
- jQuery.prototype.init選擇器構(gòu)造函數(shù)源碼思路分析
- JQuery,Extjs,YUI,Prototype,Dojo 等JS框架的區(qū)別和應(yīng)用場景簡述
- Jquery與Prototype混合用法對比
- jQuery prototype沖突的2種解決方法(附demo示例下載)
相關(guān)文章
Javascript實現(xiàn)禁止輸入中文或英文的例子
這篇文章主要介紹了Javascript實現(xiàn)禁止輸入中文或英文的方法實例,本文方法都是使用正則表達式實現(xiàn),需要的朋友可以參考下2014-12-12
使用GruntJS鏈接與壓縮多個JavaScript文件過程詳解
怎么把多個JS文件搞成一個啊，GruntJS – JavaScript多文件編譯，風(fēng)格檢查，鏈接與壓縮神器，使用過程如下，有需要的朋友可以參考下，希望對大家有所幫助2013-08-08
JS中的substring和substr函數(shù)的區(qū)別說明
stringObject.substring(start,stop)與substr(start,length)有什么區(qū)別，下面為大家詳細介紹下，感興趣的朋友可以參考下哈2013-05-05
在現(xiàn)代?Web?應(yīng)用程序中,實現(xiàn)高效的搜索功能是至關(guān)重要的,Fuse.js?是一個強大的?JavaScript?庫,它提供了靈活的模糊搜索和文本匹配功能,使您能夠輕松實現(xiàn)出色的搜索體驗,文中代碼示例講解的非常詳細,需要的朋友可以參考下2024-01-01
這篇文章主要為大家詳細介紹了js實現(xiàn)頁面導(dǎo)航層級指示效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-08-08
這篇文章主要給大家介紹了利用純JS實現(xiàn)像素逐漸顯示的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面跟著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-08-08
下面小編就為大家?guī)硪黄趯ο蠛喜⒐δ艿膶崿F(xiàn)示例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
JavaScript取得gridview中獲取checkbox選中的值
這篇文章主要介紹了 js取得gridview中獲取checkbox選中的值,本文給大家分享兩段代碼片段，非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-07-07
select標(biāo)簽設(shè)置默認選中的選項方法
下面小編就為大家分享一篇select標(biāo)簽設(shè)置默認選中的選項方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03
網(wǎng)上收集的一些經(jīng)典特效，這里因為篇幅較長，不加整理了，想運行的代碼的朋友可以點擊textarea中，全選復(fù)制即可。2010-07-07