解讀輕量級的Ajax解決方案——DynAjax的JQuery版_AJAX教程
推薦：解析ajax實現(xiàn)無刷新驗證用戶名是否存在實現(xiàn)用的是jdbc+jsp+servlet,數(shù)據(jù)庫用的是mysql 表就2個字段 實現(xiàn)原理獲得text的值后,通過調(diào)用servlet查詢數(shù)據(jù)庫里是否存在,在通過xml傳到前臺 OperationName.java response.setContentType(text/xml;charset=UTF-8)這句很重要,沒有他前臺獲得不到xml,之前
下班了，剛到家，老婆在做飯，小家伙在玩玩具，暫時沒騷擾我。呵呵！趁這空閑寫會博客。前兩天答應(yīng)改造DynAjax為JQuery版本，今天就完成這個任務(wù)吧。
上一篇隨筆介紹了輕量級的Ajax解決方案DynAjax，可惜原作者只有寫支持Prototype.js版本的。
DynAjax用到Prototype.js特殊用法的地方不多，就dynAjax.aspx和dynAjax.aspx.cs。
特殊用法分別是（紅色部分標(biāo)出）：
- var DynAjaxManager = Class.create();dynAjax.aspx第14行
- new Ajax.Request(....)dynAjax.aspx第25行至41行
- parameters: .... encodeURIComponent(Object.toJSON(args)),dynAjax.aspx第28行
- dynaResult = request.responseText.evalJSON();dynAjax.aspx第30行
以上是dynAjax.aspx的，下面的是dynAjax.aspx.cs的：
- dynamicJsText += "var " + className + "Class = Class.create();\n";dynAjax.aspx.cs第64行
分別說說紅色部分的用法：
- Class.create() 新建一個類，JQuery中我沒找到替代功能，用function 類名(){}代替。
- new Ajax.Request() 相當(dāng)于JQuery的.ajax()；
- Object.toJSON(xxx) 把xxx轉(zhuǎn)換為JSON字符串；JQuery中也沒找到替代函數(shù)，用http://www.json.org/js.html 的json2.js的 JSON.stringify(xxx)代替；
- responseText 返回數(shù)據(jù)的文本形式；發(fā)現(xiàn)JQuery中這個沒必要，去掉無妨。
- evalJSON() 將JSON字符串轉(zhuǎn)換為JSON對象；JQuery沒有可替代對象，同樣借助json2.js 的JSON.parse(xxx);不過我還是推薦用Javascript內(nèi)建的eval(‘(‘+xxx+’)’);因為JSON.parse目前版本不完善，會碰到轉(zhuǎn)不了的情況，以后再分析吧
按以上方法改版后，文件變動如下：
- prototype.js 刪
- jquery.js增
- json2.js增
改版后dynAjax.aspx代碼如下：
dynAjax.aspx.cs 第64行改為如下代碼：
別忘了在你的ajax特效網(wǎng)頁更新js引用（jquery.js和json2.js）。
/**********************************************************************
* DYNAJAX Project - code by Benoit BEGUIN
* first release: october 2007
* last update: february 2008
* Paris, France
*
* DynAjax web site: http://www.dynajax.org/
* Any question: [email protected]
* Company support: http://www.odesys.fr
**********************************************************************/
/* ------- GENERIC CONTENT ------- */
function DynAjaxManager(){}
DynAjaxManager.prototype = {
initialize: function() {},
getDynaData: function(classId, methodName, args, callBackMethod) {
var dynaResult = null;
var asyncCall = false;
if (callBackMethod && typeof callBackMethod == "function") {
asyncCall = true;
}
.ajax({
type:"POST",
url:"AjaxDataHandlers/DynAjaxHandler.aspx",
data:"classId=" + encodeURIComponent(classId) + "&methodName=" + encodeURIComponent(methodName) + "&methodArgs=" + encodeURIComponent(JSON.stringify(args)),
async:asyncCall,
success:function(request){
dynaResult = eval('('+request+')');//JSON.parse(request);
if (callBackMethod) {
callBackMethod(dynaResult);
}
},
error:function(e) {
dynaResult = null;
if (callBackMethod) {
callBackMethod(dynaResult);
}
}
});
return dynaResult;
}
};
var dynAjaxManager = new DynAjaxManager();
/* ------- END OF GENERIC CONTENT ------- */
/* ------- DYNAMIC CONTENT ------- */
<%= dynamicJsText %>
/* ------- END OF DYNAMIC CONTENT ------- */
分享：揭秘Ajax 及其入門基礎(chǔ)一、白話Ajax的原理 這個可以從 C/S 和 B/S 的原理說起。Windows操作系統(tǒng)的誕生，為單機通信提供了很大的支持，程序設(shè)計也從早期DOS的單任務(wù)單用戶向網(wǎng)絡(luò)的分布式應(yīng)用過度。C/S提供的客戶/服務(wù)器編程模式為網(wǎng)絡(luò)應(yīng)用提供了一個有效的通信手段。瀏覽器與Web服
- Ajax中瀏覽器的緩存問題解決方法
- AJAX和WebService實現(xiàn)省市縣三級聯(lián)動具體代碼
- ajax 登錄功能簡單實現(xiàn)(未連接數(shù)據(jù)庫)
- AJAX和WebService實現(xiàn)郵箱驗證(無刷新驗證郵件地址是否合法)
- AJAX和三層架構(gòu)實現(xiàn)分頁功能具體思路及代碼
- 使用AJAX返回WebService里的集合具體實現(xiàn)
- AJAX獲取服務(wù)器當(dāng)前時間及時間格式輸出處理
- ajax傳遞多個參數(shù)具體實現(xiàn)
- ajax傳遞一個參數(shù)具體實現(xiàn)
- 滑輪滾動到頁面底部ajax加載數(shù)據(jù)配合jsonp實現(xiàn)探討
- jQery ajax——load()方法示例介紹
- jQuery+Ajax實現(xiàn)表格數(shù)據(jù)不同列標(biāo)題排序(為表格注入活力)
- 相關(guān)鏈接：
- 教程說明：
AJAX教程-解讀輕量級的Ajax解決方案——DynAjax的JQuery版
。