使用hashchange加载不使用辅助导航的动态页面



关于为什么不起作用的任何想法。我正在使用CSS技巧中的教程使用AJAX动态加载页面。这一直很好,直到我在一些页面上引入了辅助导航,导致页面正常加载。

这是我正在使用的代码。我正在使用类来设计不同的导航区域。

$(function() {
var newHash      = "",
    $mainContent = $("#main-content"),
    $pageWrap    = $("#page-wrap"),
    baseHeight   = 0,
    $el;
$pageWrap.height($pageWrap.height());
baseHeight = $pageWrap.height() - $mainContent.height();
$("nav").delegate("a", "click", function() {
    window.location.hash = $(this).attr("href");
    return false;
});
$(window).bind('hashchange', function(){
    newHash = window.location.hash.substring(1);
    if (newHash) {
        $mainContent
            .find("#guts")
            .fadeOut(200, function() {
                $mainContent.hide().load(newHash + " #guts", function() {
                    $mainContent.fadeIn(200, function() {
                        $pageWrap.animate({
                            height: baseHeight + $mainContent.height() + "px"
                        });
                    });
                    $("nav a").removeClass("current");
                    $("nav a[href="+newHash+"]").addClass("current");
                });
            });
    };
});
$(window).trigger('hashchange');

});

网址:http://darynjohnson.com/Medical%20Futures/about.php

那些新创建的链接没有任何事件绑定到它们,因为u在对象上设置了delagate函数,而该函数没有更改。具有相同标签(此处为"nav")的新添加对象不会被延迟。

用途:

$('#page').delegate("nav a", "click", function() {
  window.location.hash = $(this).attr("href");
  return false;
});

此外,我建议您将jQuery升级到最新版本,并将delegate()替换为on()

相关内容

  • 没有找到相关文章