jQuery的元素选择问题

Question

我的问题是有点复杂的。

我有以下代码：

$(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和花哨的箱工作，因为它应该也导航里的链接效果很好。 那么，是什么问题？ 当我点击一个“导航里”链接，它加载的内容，然后再次点击主页链接，（我回到第一页），花式方块不再起作用。 我知道这是非常敏感的，可能是你有坏的理解，所以让我以另一种方式解释它。 我有“导航李”和幻想箱链接的选择的两个选择，是什么让他们一起工作？最好的方法

也可以有人向我解释代码一样好。结果 谢谢你。

Answer 1

好吧...这里是代码做什么：

    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
});

如果当您单击主页链接，并且此警报不弹出完整的页面重新加载，你找到你的问题的原因。