javascript得先后次序问题以及Ajax

虽然Javascript不区分先后次序，但是类似这样的语句

 

  var Cbo = new CallBackObject();
  Cbo.OnComplete = Cbo_Complete;
  Cbo.OnError = Cbo_Error;
  var Status = -1;

必须放到调用的前面，在使用Ajax得时候可以修改便于扩展，

 

// JScript 文件

function CallBackObject()
{
  this.XmlHttp = this.GetHttpObject();
}
 
CallBackObject.prototype.GetHttpObject = function()
{ 
  var xmlhttp;
  /*@cc_on
  @if (@_jscript_version >= 5)
    try {
      xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
      try {
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (E) {
        xmlhttp = false;
      }
    }
  @else
  xmlhttp = false;
  @end @*/
  if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
    try {
      xmlhttp = new XMLHttpRequest();
    } catch (e) {
      xmlhttp = false;
    }
  }
  return xmlhttp;
}
 
//CallBackObject.prototype.DoCallBack = function( Type,Err,Gold,Page,PageSize )
//{
//  if( this.XmlHttp )
//  {
//    if( this.XmlHttp.readyState == 4 || this.XmlHttp.readyState == 0 )
//    {
//      //var thePage = "../responseXml.asp?larCode=" + encodeURI( larCodeValue );
//      var thePage = "DataHelper.aspx?actionID=11&Type="+ Type +"&Err="+Err+"&Gold="+Gold+"&Page="+Page+"&PageSize="+PageSize;
//      alert( thePage );
//      // xmlhttp.open("GET","../responseXml.asp?larCode=" + encodeURI( larCodeValue ),true);
//      var oThis = this;
//      this.XmlHttp.open('GET', thePage, false);
//      this.XmlHttp.onreadystatechange = function(){ oThis.ReadyStateChange(); };
//      //this.XmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
//      this.XmlHttp.send(null);
//    }
//  }
//}

CallBackObject.prototype.DoCallBack = function( PageUrl,CallBackFun )
{
  //alert(PageUrl);
  if( this.XmlHttp )
  {
    if( this.XmlHttp.readyState == 4 || this.XmlHttp.readyState == 0 )
    {
      var oThis = this;
      this.XmlHttp.open('GET', PageUrl, false);
      this.XmlHttp.onreadystatechange = function(){ oThis.ReadyStateChange(CallBackFun); };
      //this.XmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
      this.XmlHttp.send(null);
    }
  }
}
 
CallBackObject.prototype.AbortCallBack = function()
{
  if( this.XmlHttp )
    this.XmlHttp.abort();
}
 
CallBackObject.prototype.OnLoading = function()
{
  // Loading
}
 
CallBackObject.prototype.OnLoaded = function()
{
  // Loaded
}
 
CallBackObject.prototype.OnInteractive = function()
{
  // Interactive
}
 
CallBackObject.prototype.OnComplete = function(responseText, responseXml,CallBackFun)
{
  // Complete
}
 
CallBackObject.prototype.OnAbort = function()
{
  // Abort
  //alert("Error");
}
 
CallBackObject.prototype.OnError = function(status, statusText)
{
  // Error
}
 
CallBackObject.prototype.ReadyStateChange = function(CallBackFun)
{
  if( this.XmlHttp.readyState == 1 )
  {
    this.OnLoading();
  }
  else if( this.XmlHttp.readyState == 2 )
  {
    this.OnLoaded();
  }
  else if( this.XmlHttp.readyState == 3 )
  {
    this.OnInteractive();
  }
  else if( this.XmlHttp.readyState == 4 )
  {
    if( this.XmlHttp.status == 0 )
      this.OnAbort();
    else if( this.XmlHttp.status == 200 && this.XmlHttp.statusText == "OK" )
      this.OnComplete(this.XmlHttp.responseText, this.XmlHttp.responseXML,CallBackFun);
    else
      this.OnError(this.XmlHttp.status, this.XmlHttp.statusText, this.XmlHttp.responseText);   
  }
}

调用

 

 var Cbo = new CallBackObject();
            Cbo.OnComplete = Cbo_Complete;
            Cbo.OnError = Cbo_Error;
            var Status = -1;
            
            function GetProduct( SelectedIndex,Item )
            {
               var ThePageUrl = "../Tools/ajax.aspx?Type=11&MatchID="+escape(ThisValue);
               //alert( ThePageUrl );
               Status = 1;
               Cbo.DoCallBack(  ThePageUrl,Status  );
            } 

            function Cbo_Complete(responseText, responseXML,CallBackFunType)
            {
               buildSubClass( "areaid",responseText );
            }

            function Cbo_Error(status, statusText, responseText)
            {
                alert( statusText );
            }
            
            function buildSubClass( id ,responseText )
            {  
                var subObject =  document.getElementById( id );
                deleteAllOptions(subObject);
                // 显示服务器返回的信息
                var Dom = new ActiveXObject("Microsoft.XMLDOM") //建立XMLDOM对象
                Dom.loadXML( responseText );
                if(Dom.parseError.errorCode != 0) //检查是否发生获取数据时错误
                {
                  alert( "绑定小类信息时候错误."   );           
                  //+ Dom.parseError.errorCode      
                }
                else
                {
                    var xnl = Dom.getElementsByTagName("Area");;
                    var Info ="请选择所物品";
                    appendOption(subObject,"0",Info )
                    if( xnl != null )
                    {
                        with( xnl )
                        {   
                            for ( var i = 0; i < length; i++ )
                            {   
                               if( xnl[i].text != "" )
                               {
                                     appendOption ( subObject, xnl[i].childNodes.item(0).text, xnl[i].childNodes.item(1).text) ;
                               }
                            }
                        }
                    }
                    else
                    {
                       alert("获取数据有错误。");
                    }
                    delete(Dom);
                    //var Back = Dom.documentElement.childNodes.item(0).text 
                    //alert( Dom.documentElement.childNodes.item(0).text );
                    //得到返回的XML数据,我这里假设处理程序只返回一行XML数据(一个节点)
                    //div_message.innerHTML = Back;
                    //return(Back) //函数返回数据.......................结束
                }
            }

            function appendOption(selElm,strValue,strDisp)
            {
                var newopt = document.createElement('OPTION');
                newopt.value = strValue;
                newopt.text = strDisp;
                selElm.options[selElm.options.length] = newopt;
                return false;
            }
            function deleteAllOptions(selElm)
            {  
                // alert( selElm.options.length )
                if(  selElm.options.length > 0)
                {
                    for(var i = selElm.options.length ; i >= 0 ; i--)
                    {
                      selElm.options[i] = null;
                    }
                    return false;
                }
            }

 

其实这样的调用是很方便的，但是这只是客户端的，对于服务器端的我们还需要有服务器端的调用，所以我主张一个系统可以使用两个ajax框架，无论是服务器端的还是客户端的都能方便的写出很友好的程序．