通过 ajax 将多个页面集中一个页面显示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>统一平台</title>
<link type="text/css" href="/css/redmond/ui.all.css" rel="stylesheet" />
<link href="/css/css.css" rel="stylesheet" type="text/css" />
</head>
<body style="padding:20px">
<div id="test1"></div><br />
<div id="test"></div>
</body>
</html>
<script type="text/javascript" src="/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
var baseUrl = "";
var divObj = new Object();
divObj.url = new Array();
//divObj.url.push("/index.php/Service/Salaallot");
divObj.url.push("/index.php/Service/Fault");
divObj.url.push("/index.php/Service/Salashelve");
divObj.url.push("/index.php/Service/Sbch");
divObj.url.push("/index.php/Service/Servicesend");
divObj.name = new Array();
//divObj.name.push("分配资源");
divObj.name.push("故障工单");
divObj.name.push("上架工单");
divObj.name.push("变更工单");
divObj.name.push("退机工单");
//创建DIV,DIV1....DIV5
var ajax = createAjax();
ajax.url = [];
ajax.divID = [];
for(var i=0;i<divObj.url.length;i++)
{
var bDiv = document.createElement("div");
bDiv.setAttribute("id","div_" + i.toString());
if(![-1,])
bDiv.setAttribute("cssText","width:98%;height:15%;float:left;");
else
bDiv.setAttribute("style","width:98%;height:15%;float:left;");
document.body.appendChild(bDiv);
var tDiv = document.createElement("div");
tDiv.setAttribute("id","div_" + i.toString() + "_t");
if(![-1,])
bDiv.setAttribute("cssText","width:100%;height:20%;float:left;");
else
bDiv.setAttribute("style","width:100%;height:20%;float:left;");
bDiv.appendChild(tDiv);
tDiv.innerHTML = "<b><a target='_blank' href='"+ divObj.url[i] +"'>" + divObj.name[i] + "</a></b>";
var fDiv = document.createElement("div");
fDiv.setAttribute("id","div_" + i.toString() + "_f");
if(![-1,])
bDiv.setAttribute("cssText","width:98%;height:80%;float:left;");
else
bDiv.setAttribute("style","width:98%;height:80%;float:left;");
bDiv.appendChild(fDiv);
ajax.url.push( baseUrl + divObj.url[i] );
ajax.divID.push( "div_" + i.toString() + "_f" );
ajaxExec.call(ajax,handleFunc,divObj.url.length);
}
function handleFunc()
{
var flag = false
var data = html2node(this.request.responseText);
for (var i=0;i<data.childNodes.length;i++)
{
if(data.childNodes[i].nodeName=="#text") continue;
if (this.ajaxID!==0)
{
if (data.childNodes[i].nodeName==="TABLE")
{
handleFuncMain(data,i,this,1);
break;
}
}else{
if (data.childNodes[i].nodeName==="DIV")
{
var table = data.childNodes[i].getElementsByTagName("table");
handleFuncMain(data,i,this,table[1]);
break;
}
}
}
}
function handleFuncMain(data,i,obj,value)
{
if (value==1)
{
var tr = data.childNodes[i].getElementsByTagName("tr");
var htmlObj = data.childNodes[i];
}else{
var htmlObj = !-[1,] ? value : value.childNodes[1];
var tr = htmlObj.getElementsByTagName("tr");
}
var trLength = tr.length,newTrLength = tr.length;
for(var k=trLength.length;newTrLength>4;k++)
{
htmlObj.deleteRow(newTrLength-1);
newTrLength = newTrLength - 1;
}
var a = htmlObj.getElementsByTagName("a");
for (var j=0;j<a.length;j++)
{
if (!a[j].getAttribute("onclick") && a[j].getAttribute("href").indexOf("javascript")==-1)
a[j].setAttribute("target","_blank");
}
document.getElementById(obj.divID[obj.ajaxID]).innerHTML = "<table cellspacing=\"1\" cellpadding=\"0\" class=\"table01\">" + htmlObj.innerHTML + "</table><br />";
}
/************************************************************************
* 作用 ： 控制 ajax 异步程序按顺序执行
* 例子 ： ajaxExec.call(ajax,handleFunc,divObj.url.length);
* 参数1: ajax 对象
* 参数2: onreadystatechange 事件触发事件
* 参数3: 需多次执行的次数或是重新执行异步程序的标识
***********************************************************************/
function ajaxExec()
{
var _this = this;
var _handleFunc = arguments[0];
if (arguments.length==2)
{
if (typeof(arguments[1])==="number")
{
this.ajaxIDLength = arguments[1];
}else if (arguments[1]==="afresh"){
this.ajaxID = 0;
this.first = undefined;
}
}
if (this.first==undefined)
{
this.first = true;
this.ajaxID = 0;
this.request.open("GET", this.url[0], true);
this.request.onreadystatechange = function(){
ajaxExec.call(_this,_handleFunc);
};
this.request.send(null);
}else{
if (this.ajaxIDLength!=this.url.length)
return;
this.first = false;
if (this.request.readyState == 4)
{
if (this.request.status == 200)
{
_handleFunc.call(this);
}
if (this.ajaxID===this.url.length-1)
return;
this.ajaxID = this.ajaxID + 1;
this.request.open("GET", this.url[this.ajaxID], true);
this.request.onreadystatechange = function(){
ajaxExec.call(_this,_handleFunc);
};
this.request.send(null);
}
}
}
function createAjax()
{
var request ;
try
{
request = new XMLHttpRequest();
}catch(err){
try
{
request = new ActiveXObject("Microsoft.XMLHTTP");
}catch(error){
request = new ActiveXObject("Msxml2.XMLHTTP");
}
}
if(!request)
{
alert("createAjax Error!");
}else{
this.request = request;
return this;
}
}
function html2node(s) {
var d = document.createElement('div');
d.innerHTML = s;
if (d.childNodes.length == 1)
return d.childNodes[0];
var df = document.createDocumentFragment();
while (d.firstChild)
df.appendChild(d.firstChild);
return df;
}
function accept(flt_id,fd_id){
var s=confirm("确认接单？");
if(s==true){
window.location.href='/index.php/service/fault/dealFault?act=accept&flt_id='+flt_id+'&fd_id='+fd_id;
}else{
return;
}
}
function handle(id)
{
if( confirm("你确定要受理？") )
{
var url = '/index.php/service/sbch/oinsert/id/' + id;
$.ajax({
type: "GET",
url: url,
success: function(data){
if(data!=0 && data!=-1)
{
$("#a_" + id).html("处理中");
$("#a_" + id).attr("href","/index.php/service/sbch/form/id/" + id);
$("#a_" + id + "_2").empty();
var td = $("#tr_" + id + " td");
td.eq(6).html("处理中");
td.eq(7).html(data);
window.location.href = "/index.php/service/sbch/form/id/" + id;
}else if(data==0){
alert('请登录再进行操作！');
}else{
alert('程序出错！');
}
}
});
}
}
String.prototype.trim = function() {
var str = this,
str = str.replace(/^\\s\\s*/, ''),
ws = /\\s/,
i = str.length;
while (ws.test(str.charAt(--i)));
return str.slice(0, i + 1);
}
setInterval(
function(){
ajaxExec.call(ajax,handleFunc,"afresh");
},10000
);
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>统一平台</title>
<link type="text/css" href="/css/redmond/ui.all.css" rel="stylesheet" />
<link href="/css/css.css" rel="stylesheet" type="text/css" />
</head>
<body style="padding:20px">
<div id="test1"></div><br />
<div id="test"></div>
</body>
</html>
<script type="text/javascript" src="/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
var baseUrl = "";
var divObj = new Object();
divObj.url = new Array();
//divObj.url.push("/index.php/Service/Salaallot");
divObj.url.push("/index.php/Service/Fault");
divObj.url.push("/index.php/Service/Salashelve");
divObj.url.push("/index.php/Service/Sbch");
divObj.url.push("/index.php/Service/Servicesend");
divObj.name = new Array();
//divObj.name.push("分配资源");
divObj.name.push("故障工单");
divObj.name.push("上架工单");
divObj.name.push("变更工单");
divObj.name.push("退机工单");
//创建DIV,DIV1....DIV5
var ajax = createAjax();
ajax.url = [];
ajax.divID = [];
for(var i=0;i<divObj.url.length;i++)
{
var bDiv = document.createElement("div");
bDiv.setAttribute("id","div_" + i.toString());
if(![-1,])
bDiv.setAttribute("cssText","width:98%;height:15%;float:left;");
else
bDiv.setAttribute("style","width:98%;height:15%;float:left;");
document.body.appendChild(bDiv);
var tDiv = document.createElement("div");
tDiv.setAttribute("id","div_" + i.toString() + "_t");
if(![-1,])
bDiv.setAttribute("cssText","width:100%;height:20%;float:left;");
else
bDiv.setAttribute("style","width:100%;height:20%;float:left;");
bDiv.appendChild(tDiv);
tDiv.innerHTML = "<b><a target='_blank' href='"+ divObj.url[i] +"'>" + divObj.name[i] + "</a></b>";
var fDiv = document.createElement("div");
fDiv.setAttribute("id","div_" + i.toString() + "_f");
if(![-1,])
bDiv.setAttribute("cssText","width:98%;height:80%;float:left;");
else
bDiv.setAttribute("style","width:98%;height:80%;float:left;");
bDiv.appendChild(fDiv);
ajax.url.push( baseUrl + divObj.url[i] );
ajax.divID.push( "div_" + i.toString() + "_f" );
ajaxExec.call(ajax,handleFunc,divObj.url.length);
}
function handleFunc()
{
var flag = false
var data = html2node(this.request.responseText);
for (var i=0;i<data.childNodes.length;i++)
{
if(data.childNodes[i].nodeName=="#text") continue;
if (this.ajaxID!==0)
{
if (data.childNodes[i].nodeName==="TABLE")
{
handleFuncMain(data,i,this,1);
break;
}
}else{
if (data.childNodes[i].nodeName==="DIV")
{
var table = data.childNodes[i].getElementsByTagName("table");
handleFuncMain(data,i,this,table[1]);
break;
}
}
}
}
function handleFuncMain(data,i,obj,value)
{
if (value==1)
{
var tr = data.childNodes[i].getElementsByTagName("tr");
var htmlObj = data.childNodes[i];
}else{
var htmlObj = !-[1,] ? value : value.childNodes[1];
var tr = htmlObj.getElementsByTagName("tr");
}
var trLength = tr.length,newTrLength = tr.length;
for(var k=trLength.length;newTrLength>4;k++)
{
htmlObj.deleteRow(newTrLength-1);
newTrLength = newTrLength - 1;
}
var a = htmlObj.getElementsByTagName("a");
for (var j=0;j<a.length;j++)
{
if (!a[j].getAttribute("onclick") && a[j].getAttribute("href").indexOf("javascript")==-1)
a[j].setAttribute("target","_blank");
}
document.getElementById(obj.divID[obj.ajaxID]).innerHTML = "<table cellspacing=\"1\" cellpadding=\"0\" class=\"table01\">" + htmlObj.innerHTML + "</table><br />";
}
/************************************************************************
* 作用 ： 控制 ajax 异步程序按顺序执行
* 例子 ： ajaxExec.call(ajax,handleFunc,divObj.url.length);
* 参数1: ajax 对象
* 参数2: onreadystatechange 事件触发事件
* 参数3: 需多次执行的次数或是重新执行异步程序的标识
***********************************************************************/
function ajaxExec()
{
var _this = this;
var _handleFunc = arguments[0];
if (arguments.length==2)
{
if (typeof(arguments[1])==="number")
{
this.ajaxIDLength = arguments[1];
}else if (arguments[1]==="afresh"){
this.ajaxID = 0;
this.first = undefined;
}
}
if (this.first==undefined)
{
this.first = true;
this.ajaxID = 0;
this.request.open("GET", this.url[0], true);
this.request.onreadystatechange = function(){
ajaxExec.call(_this,_handleFunc);
};
this.request.send(null);
}else{
if (this.ajaxIDLength!=this.url.length)
return;
this.first = false;
if (this.request.readyState == 4)
{
if (this.request.status == 200)
{
_handleFunc.call(this);
}
if (this.ajaxID===this.url.length-1)
return;
this.ajaxID = this.ajaxID + 1;
this.request.open("GET", this.url[this.ajaxID], true);
this.request.onreadystatechange = function(){
ajaxExec.call(_this,_handleFunc);
};
this.request.send(null);
}
}
}
function createAjax()
{
var request ;
try
{
request = new XMLHttpRequest();
}catch(err){
try
{
request = new ActiveXObject("Microsoft.XMLHTTP");
}catch(error){
request = new ActiveXObject("Msxml2.XMLHTTP");
}
}
if(!request)
{
alert("createAjax Error!");
}else{
this.request = request;
return this;
}
}
function html2node(s) {
var d = document.createElement('div');
d.innerHTML = s;
if (d.childNodes.length == 1)
return d.childNodes[0];
var df = document.createDocumentFragment();
while (d.firstChild)
df.appendChild(d.firstChild);
return df;
}
function accept(flt_id,fd_id){
var s=confirm("确认接单？");
if(s==true){
window.location.href='/index.php/service/fault/dealFault?act=accept&flt_id='+flt_id+'&fd_id='+fd_id;
}else{
return;
}
}
function handle(id)
{
if( confirm("你确定要受理？") )
{
var url = '/index.php/service/sbch/oinsert/id/' + id;
$.ajax({
type: "GET",
url: url,
success: function(data){
if(data!=0 && data!=-1)
{
$("#a_" + id).html("处理中");
$("#a_" + id).attr("href","/index.php/service/sbch/form/id/" + id);
$("#a_" + id + "_2").empty();
var td = $("#tr_" + id + " td");
td.eq(6).html("处理中");
td.eq(7).html(data);
window.location.href = "/index.php/service/sbch/form/id/" + id;
}else if(data==0){
alert('请登录再进行操作！');
}else{
alert('程序出错！');
}
}
});
}
}
String.prototype.trim = function() {
var str = this,
str = str.replace(/^\\s\\s*/, ''),
ws = /\\s/,
i = str.length;
while (ws.test(str.charAt(--i)));
return str.slice(0, i + 1);
}
setInterval(
function(){
ajaxExec.call(ajax,handleFunc,"afresh");
},10000
);
</script>
