如题,用js向php发送一个请求并加载响应到当前页面的时候,如何避免重写是覆盖当前页面;
具体情况是这样的:
js:var navLst = {};
var reqInfo = {};
reqInfo['reqNav'] = true;
reqInfo['reqSin'] = 'qtrfss';
//more limt options would be added
var reqSent= JSON.stringify(reqInfo);
var xhr = null;
if(window.XMLHttpRequest){
xhr = new XMLHttpRequest();
}else{
xhr = ActiveXObject('Microsoft.XMLHttp');
}
xhr.open('POST', '/themes/ticket/model/echoNav.php',true);
xhr.onreadystatechange=function(){
if(xhr.readyState == 4) {
if(xhr.status == 200) {
try{
var resp = eval('('+ xhr.responseText +')');
listMenu(resp);
}catch(e){
listMenu(e);
}
} else {
//undo
}
}
};
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send('reqSent='+reqSent);
/themes/ticket/model/echoNav.php返回的是一个数组字符串化的json;
然后获取到了menlist,重写的时候整个页面只剩下menulist了。。。
listmenu:
function listMenu(menuLst){//var menuLst = ['Sci-Fi','home','wiki'];//menu lst should come from php
var nav = '';
var navIE = ''+
''+
''+
''+
''+
''+
''+
''+
''+
''+
' '+
''+
'';
var navStyle = '';//stylesheet's url
nav +=navIE;
nav +=navStyle;
nav +='';
document.write(nav);
var navUl = document.createElement('ul');
navUl.id = 'onav_bar';
var navLst = ''
for (var i=0 ;i <= menuLst.length - 1; i++) {
var navLi = document.createElement('li');
var achor = document.createElement('a');
if(i == 0){
navLi.className = 'onav_top onav_logo';
achor.setAttribute('href','#');
var spanX = document.createElement('span');
spanX.className = 'onav_yellow';
spanX.innerHTML = 'Sci-Fi';
achor.appendChild(spanX);
var spanY = document.createElement('span');
spanY.className = 'onav_white';
spanY.innerHTML = '.Net';
achor.appendChild(spanY);
}else{
navLi.className = 'onav_top';
achor.setAttribute('href','#');
achor.setAttribute('target','_blank');
achor.setAttribute('title',menuLst[i]);
achor.innerHTML = menuLst[i];
}
navLi.appendChild(achor);
navUl.appendChild(navLi);
};
var navDiv = document.getElementById('onav_wrapper');
navDiv.appendChild(navUl);
//need to be brief
var oAhor = document.getElementById('onav_bar').getElementsByTagName('a');
for (i=0; i
var testAttr = oAhor[i].parentNode.getAttribute('class');
if (oAhor[i].href == window.location) {
if (testAttr === null) {
oAhor[i].parentNode.setAttribute('class', 'onav_active');
} else{
oAhor[i].parentNode.setAttribute('class', testAttr + ' onav_active');
}
}
}
}
解决方案:
是 document.write(nav); , DOM加载完成后再用document.write()方法会覆盖以前内容。测试一下,把其中函数中的方法换成document.write('')
本条技术文章来源于互联网,如果无意侵犯您的权益请点击此处反馈版权投诉
本文系统来源:php中文网