将Ajax包装成对象使用

   Ajax目前是社区内最热门的话题之一了,最近在我们的项目中用了大量的Ajax,现在把我们的使用方法在这儿写出来,希望大家能指教。

因为要用到Ajax就肯定要用到XMLHttpRequest对象,但由于不同的浏览器版本,相应的生成它的方法也有所不同,所以我们不得不对浏览器的版本进行判断,试想,如果我们要在很多地方都要写那些繁琐的代码会觉的很麻烦,代码的重用也很低,所以我们写一个Ajax的对象。代码如下:

//*********************************************************
// 目的:    AJAX类
// 输入:    无
// 返回:    返回XMLHttp对象
// 例子:    var myConn = new XHConn();
//
//           if (!myConn) alert("XMLHTTP not available. Try a newer/better browser.");
//
//           var fnWhenDone = function (oXML) { alert(oXML.responseText); };
//
//           myConn.connect("mypage.php", "POST", "foo=bar&baz=qux", fnWhenDone);
//
//*********************************************************
function XHConn()
{
  var xmlhttp = false, bComplete = false;
  try
  {
   xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  }
  catch (e)
  {
   try
   {
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
   }
    catch (e)
    {
    try
    {
     xmlhttp = new XMLHttpRequest();
    }
    catch (e)
    {
     xmlhttp = false;
    }
   }
  }
  if (!xmlhttp) return null;
  this.connect = function(sURL, sMethod, sVars, fnDone)
  {
    if (!xmlhttp) return false;
    bComplete = false;
    sVars = (sVars == '') ? Math.random() : sVars + "&" + Math.random();
    sMethod = sMethod.toUpperCase();

    try
    {
      if (sMethod == "GET")
      {
        xmlhttp.open(sMethod, sURL+"?"+sVars, true);
        xmlhttp.setRequestHeader("Content-Type", "text/html;charset=GB2312");
        sVars = "";
      }
      else
      {
        xmlhttp.open(sMethod, sURL, true);
        xmlhttp.setRequestHeader("Method", "POST "+sURL+" HTTP/1.1");
        xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
      }
      xmlhttp.onreadystatechange = function()
      {
        if (xmlhttp.readyState == 4 && !bComplete)
        {
          bComplete = true;
          fnDone(xmlhttp);
        }
      };
     
      xmlhttp.send(sVars);
    }
    catch(z)
    {
     return false;
    }
    return true;
  };
 
  return this;
}


通过这个对象,我们把那些繁琐的代码都封装到里面,这样大大提高了代码的重用性,每次要用Ajax时我们只需要在我们的页面上 new一个XHConn()对象就行了,然后通过调用它的方法connect(sURL, sMethod, sVars, fnDone)就可以和服务器进行异步交互了。



posted on 2006-06-09 16:50 nbt 阅读(281) 评论(0)  编辑  收藏 所属分类: Ajax技术


只有注册用户登录后才能发表评论。


网站导航:
 
<2006年6月>
28293031123
45678910
11121314151617
18192021222324
2526272829301
2345678

导航

统计

常用链接

留言簿(3)

随笔分类

随笔档案

文章分类

文章档案

相册

收藏夹

Java技术网站

友情链接

国内一些开源网站

最新随笔

搜索

积分与排名

最新评论

阅读排行榜

评论排行榜