题
我的问题是有点复杂的。
我有以下代码:
$(document).ready(function() {
var hash = window.location.hash.substr(1);
var href = $('#nav li a').each(function(){
var href = $(this).attr('href');
if(hash==href.substr(0,href.length-5)){
var toLoad = hash+'.html #content';
$('#content').load(toLoad)
}
});
$('#nav li a').click(function(){
var toLoad = $(this).attr('href')+' #content';
$('#content').hide('fast',loadContent);
$('#load').remove();
$('#wrapper').append('<span id="load">LOADING...</span>');
$('#load').fadeIn('normal');
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
function loadContent() {
$('#content').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#content').show('normal',hideLoader());
}
function hideLoader() {
$('#load').fadeOut('normal');
}
return false;
});
});
好吧,首先这不是我是谁编码,所以我真不明白它做什么,也是我试图改变它,但我没有成功。 该代码将选择“导航里”链接,而无需重新加载它在AJAX的方式显示页面,这意味着。 它这样做是正确的:) 现在,所有我想这样做是为了增加一个的fancybox注册用户。为了做到这一点,我应该添加以下代码。
$("a#reg").fancybox({
'hideOnContentClick': false
});
现在我只是将代码放在$ document.readyfunction和花哨的箱工作,因为它应该也导航里的链接效果很好。 那么,是什么问题? 当我点击一个“导航里”链接,它加载的内容,然后再次点击主页链接,(我回到第一页),花式方块不再起作用。 我知道这是非常敏感的,可能是你有坏的理解,所以让我以另一种方式解释它。 我有“导航李”和幻想箱链接的选择的两个选择,是什么让他们一起工作?最好的方法
也可以有人向我解释代码一样好。结果 谢谢你。
解决方案
好吧...这里是代码做什么:
var hash = window.location.hash.substr(1);
var href = $('#nav li a').each(function(){
var href = $(this).attr('href');
if(hash==href.substr(0,href.length-5)){
var toLoad = hash+'.html #content';
$('#content').load(toLoad)
}
});
这第一部分将得到哈希当前页面的,检查的“NAV丽”链接一个与该散列结束(5个字符预期),并且如果它是这种情况,将加载页面#content
的hash + ".html"
元件在当前页的#content
元件(我想这是一个div)。
想象加载的URL“ HTTP://.../page1.html#page2 一>”。第1页将在第1页的#内容的AJAX调用被加载,然后,page2.html的#内容将被加载。
$('#nav li a').click(function(){
var toLoad = $(this).attr('href')+' #content';
$('#content').hide('fast',loadContent);
$('#load').remove();
$('#wrapper').append('<span id="load">LOADING...</span>');
$('#load').fadeIn('normal');
window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
function loadContent() {
$('#content').load(toLoad,'',showNewContent())
}
function showNewContent() {
$('#content').show('normal',hideLoader());
}
function hideLoader() {
$('#load').fadeOut('normal');
}
return false;
});
这将添加以下行为“NAV丽”链接:点击时,显示一个“加载消息”并加载目标页面的#内容在当前页的#内容元素
。我没有任何想法,为什么这个剧本,尽管是可怕的,会导致您的fancybox不显示。我的猜测是,“导航礼”链接将加载与AJAX调用的内容,这会不会影响你的fancybox,这已经加载,但是当您单击主页的链接,该页面完全重新加载和的fancybox代码不执行,是有原因的。您可以通过添加一个简单的警报检查:
alert("initializing fancybox");
$("a#reg").fancybox({
'hideOnContentClick': false
});
如果当您单击主页链接,并且此警报不弹出完整的页面重新加载,你找到你的问题的原因。