jquery选项卡无法使用BBQ插件

时间:2010-12-01 20:02:22

标签: jquery

我有一个问题......而且有问题。

我正在使用Bens hashchange.js使我的链接看起来像www.site.com/abc.php#123.php,以便在标签之间划分历史记录。

这很好用,但是我在123.php里面也有一个标签插件,如果你通过www.site.com/123.php访问该页面,它很有用,但如果你试图从hashchange链接然后选项卡将被破坏。

这是标签代码:

$(".tab_content").hide(); //Hide all content
$("#files_left_pane > ul.tabs li:first").addClass("active").show(); //Activate first tab
$("#files_right_pane > .tab_content:first").show(); //Show first tab content
//On Click Event
$("#files_left_pane > ul.tabs li").click(function() {
    $("#files_left_pane > ul.tabs li").removeClass("active"); //Remove any "active" class
    $(this).addClass("active"); //Add "active" class to selected tab
    $("#files_right_pane > .tab_content").hide(); //Hide all tab content

    var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
    $(activeTab).fadeIn(); //Fade in the active ID content
    return false;
});

基于此我没有看到它检查windows.hash的任何内容,所以我不确定为什么JS没有被应用到脚本。

这是我的hashchange事件的JS:

var newHash      = "",
    $mainContent = $("#main-content"),
    $pageWrap    = $("#wrap"),
    baseHeight   = 0,
    $el;
$pageWrap.height($pageWrap.height());
baseHeight = $pageWrap.height() - $mainContent.height();
$("#nav_profile_menu").delegate("a", "click", function() {
    window.location.hash = $(this).attr("href");
    return false;
});
$(window).bind('hashchange', function(){
    newHash = window.location.hash.replace( /^#/, '' );
    if (newHash) {
        $mainContent
            .find("#content-fill")
            .fadeOut(200, function() {
                $mainContent.hide().load(newHash + " #content-fill", function() {
                    $pageWrap.animate({
                        height: baseHeight + $mainContent.height() + "px"
                    });
                    $mainContent.fadeIn(900);
                });
            });
    };
});
$(window).trigger('hashchange');

只是略过这些代码和我的场景可能会出现什么问题?

我认为JS代码没有应用于hashchange.js插件通过ajax创建的新DOM元素。

如果是这样的话,如何触发JS应用于新创建的内容?

1 个答案:

答案 0 :(得分:0)

您需要使用.live.delegate为初始加载页面后加载的项目添加动作侦听器。

jQuery Docs

上查看em