一个很不错的AJAX组件,看代码:
程序代码
调用AJAX组件时:
JS代码:
程序代码
HTML页面:
程序代码

/**************************************************************************
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;
}
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";
});
}
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>
</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>