阿贾克斯只加载一次
问题描述:
我有这样的代码:阿贾克斯只加载一次
window.onload= function() {
window.scrollTo(0, 0.9);
if (navigator.standalone) return;
for (var i= document.links.length; i-->0;) {
document.links[i].onclick= function() {
var req= new XMLHttpRequest();
req.onreadystatechange= function() {
if (this.readyState!==4) return;
document.body.innerHTML= this.responseText;
};
req.open('GET', this.href, true);
req.send();
return false;
};
}
};
它基本上获取点击和HREF到当前的身体负荷的一个的href。现在问题是它只能工作一次。一旦内容发生变化,只要我点击另一个链接(在新的页面上),它就会重定向并且URL会发生变化。然后,阿贾克斯再次工作,因为我“真正”改变页面并重置整个事情。
我有点迷失在这里。我怎样才能重置我的功能永远工作? 谢谢,
克里斯托弗
编辑: 好了,所以我想是这样的:
function ajax(){
if (navigator.standalone) return;
for (var i= document.links.length; i-->0;) {
document.links[i].onclick= function() {
var req= new XMLHttpRequest();
req.onreadystatechange= function() {
if (this.readyState!==4) return;
document.body.innerHTML= this.responseText;
};
req.open('GET', this.href, true);
req.send();
ajax();
return false;
};}
}
window.onload= function() {
window.scrollTo(0, 0.9);
ajax();
};
但无济于事......调用当它完成了ajax()函数是不够明显。任何人都可以帮助我多一点:s。这不是我的专业领域:)。
答
您必须在原始<body>
内容与响应爆炸后重新建立“点击”处理程序。由于响应返回后,旧DOM中的所有内容都消失了,处理程序绑定也消失了。
答
它被缓存吗?将“?random =”+ Math.random添加到href中。
答
您正在替换整个文档,包括您绑定AJAX处理程序的链接。
window.onload只会在文档加载时触发,而不是在ajax调用完成时触发。
把你的onload处理程序放到一个新的函数中,然后手动调用它,你的就绪状态改变处理程序。
答
当您设置document.body.innerHTML时,您将替换整个文档,这意味着您连线的onclick事件不见了。您必须将点击事件重新绑定到新链接。
答
当您用数据替换正文时,您正在删除链接。
这也是一种建议使用类似jQuery的库的代码。在这种情况下,几乎所有代码都已经降低到这一点,需要照顾的跨浏览器的问题,以及:
$('a').live('click', function() {
$.get(this.ref , function(data) {
$('body').html(data);
});
return false;
});
我试过,但它不工作,你可以看看我的编辑,告诉我是什么错误? :s – cmplieger 2011-06-14 22:03:06
在更新主体“innerHTML”之后,在“readystatechange”处理程序内添加对“ajax()”的调用,并查看是否有帮助。 – Pointy 2011-06-14 22:06:38
哦,还有,其他调用“ajax()”发送请求后,你可以摆脱这一点。 – Pointy 2011-06-14 22:07:14