轻量级的Ajax解决方案——DynAjax的JQuery版

下班了，刚到家，老婆在做饭，小家伙在玩玩具，暂时没骚扰我。呵呵！趁这空闲写会博客。前两天答应改造DynAjax为JQuery版本，今天就完成这个任务吧。
上一篇随笔介绍了轻量级的Ajax解决方案DynAjax，可惜原作者只有写支持Prototype.js版本的。
DynAjax用到Prototype.js特殊用法的地方不多，就dynAjax.aspx和dynAjax.aspx.cs。
特殊用法分别是（红色部分标出）： 

• 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() 相当于JQuery的$.ajax()；
• Object.toJSON(xxx) 把xxx转换为JSON字符串；JQuery中也没找到替代函数，用http://www.json.org/js.html 的json2.js的 JSON.stringify(xxx)代替；
• responseText 返回数据的文本形式；发现JQuery中这个没必要，去掉无妨。
• evalJSON() 将JSON字符串转换为JSON对象；JQuery没有可替代对象，同样借助json2.js 的JSON.parse(xxx);不过我还是推荐用Javascript内建的eval(‘(‘+xxx+’)’);因为JSON.parse目前版本不完善，会碰到转不了的情况，以后再分析吧

按以上方法改版后，文件变动如下：

•  prototype.js 删
•  jquery.js增
•  json2.js增

改版后dynAjax.aspx代码如下：

<% @ Page Language = " C# "  AutoEventWireup = " true "  CodeFile = " dynAjax.aspx.cs "  Inherits = " _dynAjax "   %>
/* *********************************************************************
 * 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: mailto:admin@dynajax.org
 * 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 -------  */

dynAjax.aspx.cs 第64行改为如下代码：

              dynamicJsText  +=   " function  "   +  className  +   " Class(){}\n " ;

别忘了在你的ajax特效网页更新js引用（jquery.js和json2.js）。

最后，我做了个演示用的压缩包，下载dynAjax_v1.04_jquery_by_kai.ma.rar  Enjoy it!

本文转自Kai的世界,道法自然博客园博客，原文链接：http://www.cnblogs.com/kaima/archive/2008/03/17/1110368.html，如需转载请自行联系原作者。