深层链接嵌套选项卡

时间:2012-01-30 06:33:11

标签: deep-linking

如果我想实现嵌套标签,是否有人知道如何使此示例有效?我试图添加它们,但我一直在破坏我的页面。

我正在使用jquery.address-1.4插件来深入链接工作。任何人都可以给予任何帮助将非常感激。 http://dl.dropbox.com/u/14080718/jquery.address-1.4/samples/tabs/index.html

          var tabs,
            tabulation = false,
            initialTab = 'Overview',
            navSelector = '#tabs .ui-tabs-nav',
            navFilter = function(el) {
                return $(el).attr('href').replace(/^#/, '');
            },
            panelSelector = '#tabs .ui-tabs-panel',
            panelFilter = function() {
                $(panelSelector + ' a').filter(function() {
                    return $(navSelector + ' a[title=' + $(this).attr('title') + ']').size() != 0;
                }).each(function(event) {
                    $(this).attr('href', '#' + $(this).attr('title').replace(/ /g, '_'));
                });
            };

        if ($.address.value() == '') {
            $.address.value(initialTab);
        }

        // Address handler
        $.address.history(false).strict(false).wrap(true).init(function(event) {

            // Adds the ID in a lazy manner to prevent scrolling
            $(panelSelector).attr('id', initialTab);

            // Enables the plugin for all the content links
            $(panelSelector + ' a').address(function() {
                return navFilter(this);
            });

            panelFilter();

            // Tabs setup
            tabs = $('#tabs')
                .tabs({
                    load: function(event, ui) {
                        // Filters the content and applies the plugin if needed
                        $(ui.panel).html($(panelSelector, ui.panel).html());
                        panelFilter();
                    },
                    fx: {
                        opacity: 'toggle', 
                        duration: 'fast'
                    }
                })
                .css('display', 'block');

            // Enables the plugin for all the tabs
            $(navSelector + ' a').click(function(event) {
                tabulation = true;
                $.address.value(navFilter(event.target));
                tabulation = false;
                return false;
            });

        }).change(function(event) {

            var current = $('a[href=#' + event.value + ']:first');

            // Sets the page title
            $.address.title($.address.title().split(' | ')[0] + ' | ' + current.text());

            // Selects the proper tab
            if (!tabulation) {
                tabs.tabs('select', current.attr('href'));
            }

        }).history(true);

        // Hides the tabs during initialization
        document.write('<style type="text/css"> #tabs { display: none; } </style>');

0 个答案:

没有答案