我正在尝试为使用 AJAX 加载基于 URL 中的锚点的内容的小页面构建 Javascript 侦听器。在网上看,我找到并修改了一个用于执行此操作的脚本,setInterval()
到目前为止它运行良好。但是,我$(document).ready()
在菜单和内容的特殊效果中还有其他 jQuery 元素。如果我setInterval()
不使用其他 jQuery 效果。我想出了一种方法,通过在循环中包含 jQuery 效果来使其工作,setInterval()
如下所示:
$(document).ready(function() {
var pageScripts = function() {
pageEffects();
pageURL();
}
window.setInterval(pageScripts, 500);
});
var currentAnchor = null;
function pageEffects() {
// Popup Menus
$(".bannerMenu").hover(function() {
$(this).find("ul.bannerSubmenu").slideDown(300).show;
}, function() {
$(this).find("ul.bannerSubmenu").slideUp(400);
});
$(".panel").hover(function() {
$(this).find(".panelContent").fadeIn(200);
}, function() {
$(this).find(".panelContent").fadeOut(300);
});
// REL Links Control
$("a[rel='_blank']").click(function() {
this.target = "_blank";
});
$("a[rel='share']").click(function(event) {
var share_url = $(this).attr("href");
window.open(share_url, "Share", "width=768, height=450");
event.preventDefault();
});
}
function pageURL() {
if (currentAnchor != document.location.hash) {
currentAnchor = document.location.hash;
if (!currentAnchor) {
query = "section=home";
} else {
var splits = currentAnchor.substring(1).split("&");
var section = splits[0];
delete splits[0];
var params = splits.join("&");
var query = "section=" + section + params;
}
$.get("loader.php", query, function(data) {
$("#load").fadeIn("fast");
$("#content").fadeOut(100).html(data).fadeIn(500);
$("#load").fadeOut("fast");
});
}
}
这在一段时间内可以正常工作,但在页面加载几分钟后,它会在 IE 和 Firefox 中拖到几乎停止的位置。我检查了 FF 错误控制台,它返回错误“递归太多”。Chrome 似乎不在乎,尽管页面已经打开了很长时间,但该页面或多或少地继续正常运行。
在我看来,该pageEffects()
调用导致了递归问题,但是,任何将其移出循环的尝试都会破坏它们,并且一旦setInterval
使其成为第一个循环,它们就会停止工作。
对此的任何帮助将不胜感激!