使用外部链接和哈希打开特定的手风琴选项卡

Open specific accordion tab using external link and hash

本文关键字:手风琴 选项 外部 链接 哈希打      更新时间:2023-09-26

大家好,我是js的新手,对不起我现在在这里问的问题我知道这是一个基本的,我现在正在使用手风琴插件,该插件收集用户想要放入手风琴中的所有文章并在手风琴中查看,我的问题是当手风琴项目内的每篇文章具有动态ID时,如何打开特定选项卡。 我试图使用链接挂钩该项目, http//:example.com#id 在手风琴中打开特定选项卡,这里是插件代码。钩在代码内并触发 Click 事件以打开特定的 In Accordion 插件

!(函数($){

$.fn.spAccordion = function(options){
    var settings = $.extend({
        hidefirst: 0
    }, options);
    return this.each(function(){
        var $items      = $(this).find('>div');
        var $handlers   = $items.find('.toggler');
        var $panels     = $items.find('.sp-accordion-container');
        if( settings.hidefirst === 1 )
        {
            $panels.hide().first();
        }
        else
        {
            $handlers.first().addClass('active');
            $panels.hide().first().slideDown();
        }
        $handlers.on('click', function(){
            if( $(this).hasClass('active') )
            {
                $(this).removeClass('active');
                $panels.slideUp();
            }
            else
            {
                $handlers.removeClass('active');
                $panels.slideUp();
                $(this).addClass('active').parent().find('.sp-accordion-container').slideDown();
            }
            event.preventDefault();
        });
    });
};

})(jQuery);

有一点是,您可以使用.children('div')而不是.find('>div')

但是如果你想得到哈希设置的内容,你可以使用 window.location.hash .默认情况下,这用于标识元素 ID。所以理想情况下,你可以通过做来获得你想要显示的元素

if (window.location.hash) {
    var $selected = $('#'+window.location.hash);
    if ($selected.length) {
        // Do what you need to show this element
    }
 }