Quantcast
Channel: 终吾一生--SonTin'Blog - Javascript
Viewing all articles
Browse latest Browse all 10

一个很不错的AJAX组件

$
0
0
一个很不错的AJAX组件,看代码:
程序代码 程序代码
/**************************************************************************
  SupeSite/X-Sapce - Ajax for SS/XS
  Copyright 2001-2006 Comsenz Inc.
*******************************************************************************/

var xml_http_building_link = '请等待,正在建立连接...';
var xml_http_sending = '请等待,正在发送数据...';
var xml_http_loading = '请等待,正在接受数据...';
var xml_http_load_failed = '通信失败,请刷新重新尝试';
var xml_http_data_in_processed = '通信成功,数据正在处理中...';

function Ajax(statusId, recvType) {
    var aj = new Object();
    if(document.getElementById(statusId)) {
        aj.statusId = document.getElementById(statusId);
    } else {
        var divElement = document.createElement("DIV");
        divElement.className = "xweb-ajaxmsg";
        divElement.style.position = "fixed";
        divElement.style.right = "0";
        divElement.style.top = "0";
        divElement.style.background = "red";
        divElement.style.color = "#FFF";
        divElement.style.lineHeight = "2em";
        divElement.style.padding = "0 20px";
        divElement.id = statusId;
        document.body.appendChild(divElement);
        aj.statusId = divElement;
    }
    
    aj.targetUrl = '';
    aj.sendString = '';
    aj.recvType = recvType ? recvType : 'HTML';//HTML XML
    aj.resultHandle = null;

    aj.createXMLHttpRequest = function() {
        var request = false;
        if(window.XMLHttpRequest) {
            request = new XMLHttpRequest();
            if(request.overrideMimeType) {
                request.overrideMimeType('text/xml');
            }
        } else if(window.ActiveXObject) {
            var versions = ['Microsoft.XMLHTTP', 'MSXML.XMLHTTP', 'Microsoft.XMLHTTP', 'Msxml2.XMLHTTP.7.0', 'Msxml2.XMLHTTP.6.0', 'Msxml2.XMLHTTP.5.0', 'Msxml2.XMLHTTP.4.0', 'MSXML2.XMLHTTP.3.0', 'MSXML2.XMLHTTP'];
            for(var i=0; i<versions.length; i++) {
                try {
                    request = new ActiveXObject(versions[i]);
                    if(request) {
                        return request;
                    }
                } catch(e) {
                    //alert(e.message);
                }
            }
        }
        return request;
    }

    aj.XMLHttpRequest = aj.createXMLHttpRequest();

    aj.processHandle = function() {
        aj.statusId.style.display = '';
        if(aj.XMLHttpRequest.readyState == 1) {
            aj.statusId.innerHTML = xml_http_building_link;
        } else if(aj.XMLHttpRequest.readyState == 2) {
            aj.statusId.innerHTML = xml_http_sending;
        } else if(aj.XMLHttpRequest.readyState == 3) {
            aj.statusId.innerHTML = xml_http_loading;
        } else if(aj.XMLHttpRequest.readyState == 4) {
            if(aj.XMLHttpRequest.status == 200) {
                aj.statusId.style.display = 'none';
                if(aj.recvType == 'HTML') {
                    aj.resultHandle(aj.XMLHttpRequest.responseText);
                } else if(aj.recvType == 'XML') {
                    aj.resultHandle(aj.XMLHttpRequest.responseXML);
                }
            } else {
                aj.statusId.innerHTML = xml_http_load_failed;
            }
        }
    }

    aj.get = function(targetUrl, resultHandle) {
        aj.targetUrl = targetUrl;
        aj.XMLHttpRequest.onreadystatechange = aj.processHandle;
        aj.resultHandle = resultHandle;
        if(window.XMLHttpRequest) {
            aj.XMLHttpRequest.open('GET', aj.targetUrl);
            aj.XMLHttpRequest.send(null);
        } else {
            aj.XMLHttpRequest.open("GET", targetUrl, true);
            aj.XMLHttpRequest.send();
        }
    }

    aj.post = function(targetUrl, sendString, resultHandle) {
        aj.targetUrl = targetUrl;
        aj.sendString = sendString;
        aj.XMLHttpRequest.onreadystatechange = aj.processHandle;
        aj.resultHandle = resultHandle;
        aj.XMLHttpRequest.open('POST', targetUrl);
        aj.XMLHttpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        aj.XMLHttpRequest.send(aj.sendString);
    }
    return aj;
}


调用AJAX组件时:
JS代码:
程序代码 程序代码
//根据参数ID获取链接地址的参数值
function getthe_hrefvar(strVar)
{
    var the_urlvar="0";
    if(strVar)
    {
        if(document.location.search.substr(1))
        {
    var aParams = document.location.search.substr(1).split('&');
    for (i=0; i<aParams.length; i++)
    {
         var aParam = aParams[i].split('=');
         if(aParam[0]==strVar)
         {
                          the_urlvar = aParam[1];
              break;
          }
    }
        }
    }
    return the_urlvar;
}

function getbyid(id) {
    if (document.getElementById) {
         return document.getElementById(id);
    } else if (document.all) {
         return document.all[id];
    } else if (document.layers) {
        return document.layers[id];
     } else {
        return null;
     }
}
//自定义调用AJAX
//参数:显示状态的ID,显示返回结果的ID,显示结果的CSS,调用URL地址,显示结果DIV的宽度(0默认)
function showajax_div(status_id,showhtml_obj,showobj_class,url,width) {
    //var x = new Ajax('statusid', 'XML');
    var x = new Ajax(status_id, 'HTML');
    x.get(url, function(s){
        if(getbyid(showhtml_obj)) {
            var divElement = getbyid(showhtml_obj);
        } else {
            var divElement = document.createElement("DIV");
            divElement.id = showhtml_obj;
            divElement.className = showobj_class;
            document.body.appendChild(divElement);
        }
        if(width)
        {
            divElement.style.cssText = "width:"+width+"px;";
        }
        var userAgent = navigator.userAgent.toLowerCase();
        var is_opera = (userAgent.indexOf('opera') != -1);
        var clientHeight = 0;
        var scrollTop = 0;
        if(is_opera) {
            clientHeight = document.body.clientHeight /2;
            scrollTop = document.body.scrollTop;
        } else {
            clientHeight = document.documentElement.clientHeight /2;
            scrollTop = document.documentElement.scrollTop;
        }
        //divElement.innerHTML = s.lastChild.firstChild.nodeValue;
        if(s)
        {
            divElement.style.display = "block";
        }
        divElement.innerHTML = s;
        if(width)
        {
            divElement.style.left = (document.documentElement.clientWidth/2 + document.documentElement.scrollLeft - width/2)+"px";
        }
        else
        {
            divElement.style.left = (document.documentElement.clientWidth/2 + document.documentElement.scrollLeft)+"px";
        }
        divElement.style.top = (clientHeight + scrollTop - divElement.clientHeight/2)+"px";                        
    });    
}

HTML页面:
程序代码 程序代码
<div id="statusid" class="xweb-ajaxmsg">
</div>
<div id="xweb-ajax-div" class="xweb-ajaxdiv">
</div>
<script type="text/javascript" language="javascript">
var getHtmlFile="../ajax_asp/news_list.asp";
var pageVal=getthe_hrefvar("page");
    if(pageVal>0)
    {
        getHtmlFile=getHtmlFile + "?page=" + pageVal;
    }
var sortIdVal=getthe_hrefvar("sortid");
    if(sortIdVal)
    {
       if (getHtmlFile.indexOf("?")>=0)
        {
              getHtmlFile=getHtmlFile + "&sortid=" + sortIdVal
        }
       else
        {
               getHtmlFile=getHtmlFile + "?sortid=" + sortIdVal
        }
    }
      showajax_div("statusid","xweb-ajax-div","xweb-ajaxdiv",getHtmlFile,0);
</script>

Viewing all articles
Browse latest Browse all 10

Trending Articles