不用AJAX和IFRAME,說說真正意義上的ASP+JS無刷新技術(shù)
更新時間:2008年09月25日 09:40:49 作者:
注明:以下方法都經(jīng)過實(shí)例和開發(fā)的長期驗(yàn)證,其實(shí)這些技術(shù)早就有,今天只不過自己歸納一下
網(wǎng)上流傳的什么<<AJAX vs ASP傳統(tǒng)無刷新>>中的ASP無刷新,加個IFRAME,弄個JS根本不能稱之為無刷新.....
一下代碼未區(qū)分大小寫,請自行修改!
全靜態(tài)無刷新思路:
<HTML>
<SCRIPT SRC=""></SCRIPT>//當(dāng)前頁面全局的 無數(shù)新調(diào)用
<SCRIPT> //一系列JS調(diào)用
FUNCTION XX(FUN_NAME,PARAMETER_NAME,PARAMETER_VALUE)//參數(shù)自己設(shè)定
{
DOCMENT.SCRIPTS[0].SRC='AJAX.ASP?'+PARAMETER_NAME+'='+PARAMETER_VALUE;//參數(shù)以此類推
}
</SCRIPT>
<BODY>
//示例調(diào)用一,直接調(diào)用ASP
我的數(shù)據(jù)庫有<SCRIPT SRC="GET_COUNT.ASP?ID=XXX"></SCRIPT>條
//示例調(diào)用二,事件調(diào)用AJAX.ASP
我的數(shù)據(jù)庫有<LABEL ID="COUNT"></LABEL>條<INPUT TYPE="BUTTON" ONCLICK="JAVASCRIPT:XX(COUNT,'ID',DOCUMENT.ALL.ID.VALUE);">
</BODY>
</HTML>
//示例二中AJAX.ASP代碼
<%
SET RS = CONN.EXECUTE(SQL_STR)
RESPONSE.WRITE "DOCUMENT.GETELEMENTBYID('COUNT').VALUE = '"&RS("COUNT")&"'"
%>
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
以下省略部分HTML代碼,只說明思路
//示例三 FORM表單ONSUBMIT事件調(diào)用AJAX.ASP
<SCRIPT SRC=""></SCRIPT>//這句是必須的
<SCRIPT>
function CHECK()
{
alert('1');
//document.getElementByID("")
document.scripts[0].src = "AJAX.ASP?a="+escape(document.getElementById('T1').value);//這里給第一個script.src賦值
alert(document.scripts[0].src);//查看測試地址是否正確
return false;
}
</SCRIPT>
<FORM METHOD="POST" ACTION="" ONSUBMIT="return CHECK();" NAME="FORM1">
<INPUT TYPE="TEXT" NAME="T1" ID="T1">
<INPUT TYPE="SUBMIT" VALUE="SUBMIT" >
</FORM>
//示例三AJAX.ASP代碼
<%
RESPONSE.WRITE "alert('"&request("a")&"');"http://////或者寫response.write "document.getelementbyid('id').innerhtml='某些html代碼';"
%>
//////////////////////////////////////////////////////////////////////////////////////////////////
優(yōu)點(diǎn):
此種無刷新方法對比AJAX技術(shù)的優(yōu)勢在于,這種方法所需要編寫的代碼更少,更簡潔,開發(fā)速度更快,不用書寫過于龐大復(fù)雜的JS判斷,同樣利用JS,但沒有用到DOM XML,同樣有跨平臺的優(yōu)勢,能達(dá)到AJAX同樣的用戶體驗(yàn)效果,可以和AJAX同時使用,不同功能的實(shí)現(xiàn)代碼書寫模式和流程,幾乎相同,更易提高代碼復(fù)用性,事實(shí)上只需建立2個文件就可以實(shí)現(xiàn)網(wǎng)站各種不同的功能
缺點(diǎn):
因?yàn)榇思夹g(shù)完全依靠JS給URL或者COOKIES賦值,然后通過URL和cookies傳參,但URL和cookies參數(shù)大小和長度是有所限制的,所以無法像AJAX那樣傳送大量信息除非仿照AJAX或直接用AJAX完成,不過我相信會找到更好的解決方案
一下代碼未區(qū)分大小寫,請自行修改!
全靜態(tài)無刷新思路:
<HTML>
<SCRIPT SRC=""></SCRIPT>//當(dāng)前頁面全局的 無數(shù)新調(diào)用
<SCRIPT> //一系列JS調(diào)用
FUNCTION XX(FUN_NAME,PARAMETER_NAME,PARAMETER_VALUE)//參數(shù)自己設(shè)定
{
DOCMENT.SCRIPTS[0].SRC='AJAX.ASP?'+PARAMETER_NAME+'='+PARAMETER_VALUE;//參數(shù)以此類推
}
</SCRIPT>
<BODY>
//示例調(diào)用一,直接調(diào)用ASP
我的數(shù)據(jù)庫有<SCRIPT SRC="GET_COUNT.ASP?ID=XXX"></SCRIPT>條
//示例調(diào)用二,事件調(diào)用AJAX.ASP
我的數(shù)據(jù)庫有<LABEL ID="COUNT"></LABEL>條<INPUT TYPE="BUTTON" ONCLICK="JAVASCRIPT:XX(COUNT,'ID',DOCUMENT.ALL.ID.VALUE);">
</BODY>
</HTML>
//示例二中AJAX.ASP代碼
<%
SET RS = CONN.EXECUTE(SQL_STR)
RESPONSE.WRITE "DOCUMENT.GETELEMENTBYID('COUNT').VALUE = '"&RS("COUNT")&"'"
%>
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
以下省略部分HTML代碼,只說明思路
//示例三 FORM表單ONSUBMIT事件調(diào)用AJAX.ASP
<SCRIPT SRC=""></SCRIPT>//這句是必須的
<SCRIPT>
function CHECK()
{
alert('1');
//document.getElementByID("")
document.scripts[0].src = "AJAX.ASP?a="+escape(document.getElementById('T1').value);//這里給第一個script.src賦值
alert(document.scripts[0].src);//查看測試地址是否正確
return false;
}
</SCRIPT>
<FORM METHOD="POST" ACTION="" ONSUBMIT="return CHECK();" NAME="FORM1">
<INPUT TYPE="TEXT" NAME="T1" ID="T1">
<INPUT TYPE="SUBMIT" VALUE="SUBMIT" >
</FORM>
//示例三AJAX.ASP代碼
<%
RESPONSE.WRITE "alert('"&request("a")&"');"http://////或者寫response.write "document.getelementbyid('id').innerhtml='某些html代碼';"
%>
//////////////////////////////////////////////////////////////////////////////////////////////////
優(yōu)點(diǎn):
此種無刷新方法對比AJAX技術(shù)的優(yōu)勢在于,這種方法所需要編寫的代碼更少,更簡潔,開發(fā)速度更快,不用書寫過于龐大復(fù)雜的JS判斷,同樣利用JS,但沒有用到DOM XML,同樣有跨平臺的優(yōu)勢,能達(dá)到AJAX同樣的用戶體驗(yàn)效果,可以和AJAX同時使用,不同功能的實(shí)現(xiàn)代碼書寫模式和流程,幾乎相同,更易提高代碼復(fù)用性,事實(shí)上只需建立2個文件就可以實(shí)現(xiàn)網(wǎng)站各種不同的功能
缺點(diǎn):
因?yàn)榇思夹g(shù)完全依靠JS給URL或者COOKIES賦值,然后通過URL和cookies傳參,但URL和cookies參數(shù)大小和長度是有所限制的,所以無法像AJAX那樣傳送大量信息除非仿照AJAX或直接用AJAX完成,不過我相信會找到更好的解決方案
相關(guān)文章
Javascript 實(shí)現(xiàn)匿名遞歸的實(shí)例代碼
本篇文章主要介紹了Javascript 實(shí)現(xiàn)匿名遞歸的實(shí)例代碼,利用 arguments.callee 來實(shí)現(xiàn)匿名遞歸的方式。有興趣的可以了解一下2017-05-05js實(shí)現(xiàn)同一頁面多個不同運(yùn)動效果的方法
這篇文章主要介紹了js實(shí)現(xiàn)同一頁面多個不同運(yùn)動效果的方法,涉及javascript同時實(shí)現(xiàn)多個效果的技巧,非常具有實(shí)用價值,需要的朋友可以參考下2015-04-04uni-app使用uploadFile上傳多張圖片的具體實(shí)現(xiàn)
在微信小程序中不支持多張圖片上傳,需要做循環(huán)實(shí)現(xiàn)多張圖片上傳,下面這篇文章主要給大家介紹了關(guān)于uni-app使用uploadFile上傳多張圖片的具體實(shí)現(xiàn),需要的朋友可以參考下2023-04-04JavaScript正則函數(shù)中test和match的區(qū)別解析
在javascript中,用于檢測一個字符串是否匹配某個模式用的比較多的就是test和match方法。,這篇文章主要介紹了js正則函數(shù)中test和match的區(qū)別,需要的朋友可以參考下2022-11-11