首页 > 开发 > AJAX > 正文

Ajax.Request类附代码详细解析

2024-09-01 08:30:14
字体:
来源:转载
供稿:网友

  下面给大家分享一篇Ajax.Request类附代码详细解析,感兴趣的朋友跟小编一起来了解一下吧!希望对大家有所帮助哦!

  目的:因为blog程序里的某些模块需要用到ajax,直接使用prototype.js体积比较大(40多k),而且仅仅用到其中的ajax功能,因此为了减轻下载的负担,又不能改动已经在prototype.js框架下写好的代码,只能是按照prototype的风格,自己写一个ajax类,达到零成本移植框架。

  新的ajax类如下:

  varAjax={xmlhttp:function(){

  try{

  returnnewActiveXObject('Msxml2.XMLHTTP');

  }catch(e){

  try{

  returnnewActiveXObject('Microsoft.XMLHTTP');

  }catch(e){

  returnnewXMLHttpRequest();

  }

  }

  }

  };

  Ajax.Request=function(){

  if(arguments.length

  var_p={asynchronous:true,method:"GET",parameters:""};//defaultoption

  for(varkeyinarguments[1]){//customoptionoverwritedefaultoption

  _p[key]=arguments[1][key];

  }

  var_x=Ajax.xmlhttp();//xmlobj

  var_url=arguments[0];//str

  if(_p["parameters"].length>0)_p["parameters"]+='&_=';

  if(_p["method"].toUpperCase()=="GET")_url+=(_url.match(//?/)?'&':'?')+_p["parameters"];

  _x.open(_p["method"],_url,_p["asynchronous"]);

  _x.onreadystatechange=function(){

  if(_x.readyState==4){

  if(_x.status==200){

  _p["onComplete"]?_p["onComplete"](_x):"";

  }else{

  _p["onError"]?_p["onError"](_x):"";

  }

  }

  }

  if(_p["method"].toUpperCase()=="POST")_x.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

  _x.send(_p["method"].toUpperCase()=="POST"?_p["parameters"]:null);

  };

  这个类保存成js文件,体积还不到1k,足够小了。哈哈。

  调用方法:

  varmyAjax=newAjax.Request(

  "http://localhost/abc.asp",

  {

  method:"post",

  parameters:"demo=123456789abc",

  onComplete:function(xmlhttp){

  alert(xmlhttp.responseText)

  }

  }

  );

  调用的风格完全与原来相同!

  目前这个新类只有两个回调函数:onComplete与onError,Ajax类也只有Request一个方法,毕竟现在blog程序还不需要这么多应用嘛。parameters属性有个默认值:{asynchronous:true,method:"GET",parameters:""},可以从中知道,如果调用时不传入asynchronous、method、parameters三个参数,那么类将使用默认值。

  以上就是Ajax.Request类附代码详细解析,想必都了解了吧,更多相关内容请继续关注错新技术频道。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表