1

问题:动态加载页面中的链接不会动态加载其他页面。

在我的索引页面上,我有如下链接:

<li><a class="page_one" title="page_one" href="page_one.html">Page One</a></li>
<li><a class="page_two" title="page_two" href="page_two.html">Page Two</a></li>

这些使用脚本dynamicpage.js(如下)将外部页面中的内容动态加载<div id="guts">到索引页面上具有相同ID的div中,除非javascript关闭,否则它将简单地正常加载外部页面。

这是javascript:

    $(function() {

    var newHash      = "",
        $mainContent = $("#main-content"),
        $pageWrap    = $("#page-wrap"),
        $el;



    $(".dyn").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({

                            });
                        });
                        $(".dyn a").removeClass("current");
                        $(".dyn a[href="+newHash+"]").addClass("current");
                    });
                });
        };

    });

    $(window).trigger('hashchange');

});

索引页面上的链接运行良好,但例如,如果我想从动态加载的 page_1.html 链接到 page_2.html,page_2 正在正常加载,而不是将 url 更新为 /#page_2.html

我尝试将 .delegate 更改为 .live,但这完全停止了它的工作。

谁能把我推向正确的方向?

提前致谢!

4

1 回答 1

1

试试这个:

$("#main-content").delegate(".dyn a", "click", function() {
    window.location.hash = $(this).attr("href");
    return false;
});

原因如下:你的功能

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

在匹配元素中的click退出元素和新元素上正确绑定处理程序。因此,如果您要向元素添加新标签,脚本将按预期工作。<a>.dyn<a>.dyn

但是,该$mainContent.hide().load(...方法将 的内容替换为$("#mai-content")新加载的内容,这意味着您已经替换了原始内容,$(".dyn")因此委托函数现在正在查看已删除的.dyn.

将您的委托匹配移动到$("#main-content"),您将维护一个活动的“实时”或“委托”观察者,它将正确地将您定义的点击处理程序绑定到新.dyn a元素。

于 2012-07-06T00:10:58.113 回答