将jQuery自定义手风琴绑定到url hash标签

时间:2016-11-03 12:09:25

标签: javascript jquery html hash accordion

我有jQuery自定义手风琴功能,我想将它绑定到url,url中给出的每个哈希标签都会打开所需的元素。 我在函数中添加了var hash并尝试将其分配给活动变量,但它不起作用。任何想法如何修改它?

jQuery.fn.extend({  
    accordion: function() {       
        return this.each(function() {   
            var $ul = jQuery(this);             
            if($ul.data('accordiated'))
                return false;                                           
            jQuery.each($ul.find('ul, li>div'), function(){
                jQuery(this).data('accordiated', true);
                jQuery(this).hide();
            });

            jQuery.each($ul.find('a'), function(){
                jQuery(this).click(function(e){
                    activate(this);
                    return void(0);
                });
            });

            var hash = window.location.hash;
            var active = jQuery('.accordion .active');

            if(active){
                activate(active, 'toggle');
                jQuery(active).parents().show();
            }

            function activate(el,effect){
                Query(el).parent('li').toggleClass('active').siblings().removeClass('active').children('ul, div').slideUp('fast');
                jQuery(el).siblings('ul, div')[(effect || 'slideToggle')]((!effect)?'fast':null);
            }

        });
    } 
}); 

jQuery('.accordion ul').accordion();

这里是html结构:

<div class="accordion">
    <ul class="accordion">
        <li class="active">
            <a href="#health" class="active">Health<span></span></a>
            <ul>
                <li><a href="#health-implants">Implants<span></span></a>
                    <p>Content</p>
                </li>
                <li><a href="#health-protetic">Protetic<span></span></a>
                    <p>Content</p>
                </li>
            </ul>
        </li>
        <li><a href="#estetic">Link 2<span></span></a>
            <p>Content</p>
        </li>
    </ul>
</div>

0 个答案:

没有答案