Question

我正在关注this页面制作ajax网站。这是相当简单的，但我遇到的问题是链接，只是

   <a href="link.html">Link</a>

倾向于忽略主题标签更改并直接转到link.html页面导致重新加载而不是使用ajax更新内容。

当我点击后退按钮时，ajax部分工作，然后当我从那里点击链接时它可以工作 - 任何想法在页面首次登陆时导致此行为的原因是什么？

我正在使用jQuery UI中的导航菜单，如果您需要更多信息，请告诉我，我会尽快发布。

感谢您的帮助！

这是控制ajax行为的dynamic.js文件：

$(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');

});

Answer 1

您是否尝试在将click事件分配给链接时使用preventDefault（）？

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

return false应该做的工作，但只是为了确保

Answer 2

当我查看页面的来源时，您有代码执行此操作：

$( "#menu" ).menu({

});

在其中，你有：

location.href = link.attr( "href" );

我有一种感觉，因为除了你的hashchange处理之外它正在执行它，它被调用并覆盖（以任何方式）AJAX加载的东西。如果您删除/注释该行，它可能会有效，但在您进行此更改后，请确保您的网站仍然可以正常运行。

Hashtag ajax不能始终如一地工作

2 个答案: