使用Tumblr无限滚动与另一个脚本
Using Tumblr infinite scrolling with another script
我在这里使用codysherman的javascript代码:http://codysherman.com/tools/infinite-scrolling/code
我也使用一个简单的jquery脚本来动态地改变div的背景图像,持有tumblr的帖子。
jquery代码工作得很好,但我需要一种方法来调用函数时,无限滚动脚本更新新的帖子。我想这是他们互相交谈的一种方式。
你可以在这里看到页面:http://hypergeography.tumblr.com/(它还没有使用无限滚动。但是它确实有改变背景图像的脚本。)
如果您觉得足够安全,您绝对可以进入该代码(它根本不长)并向onreadystatechange部分添加一些逻辑。Ajax调用完成后触发此事件。如果钩到它,就可以很容易地添加一些东西来与代码对话。
另一种方法是劫持XMLHttpRequest
,这样一旦它的send()
方法被调用,您就可以附加您自己的事件侦听器来监视'load'事件的请求。一旦请求完成,就可以调用自定义函数。可以这样做:
XMLHttpRequest.prototype.originalSend=XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send=function(s){
this.addEventListener('load',function(){
//CALL YOUR CODE HERE
},false);
this.originalSend(s);
}
或者,您可以劫持onreadystatechange函数来添加一些您自己的逻辑:
XMLHttpRequest.prototype.originalSend=XMLHttpRequest.prototype.send;
XMLHttpRequest.prototype.send=function(s){
if(this.onreadystatechange){
var oldORSC=this.onreadystatechange;
}
this.onreadystatechange=function(){
if (this.readyState==4 && this.status==200){ //a successful request
//CALL YOUR CODE HERE
}
if(oldORSC){
oldORSC();
}
}
this.originalSend(s);
}
当然,如果你想要支持IE,你将不得不对他们用于AJAX的ActiveXObject做类似的事情。但是我不使用它,所以我不能给你任何例子。
编辑:这假设您的页面仅为此目的调用。如果有其他AJAX调用,则需要添加逻辑来确定正在使用哪个调用。为此,您可以钩入open()
方法并检查URL或参数或任何特定信息,这些信息将帮助您确定调用的方向,然后相应地修改请求。