使用 cbpFWTabs 打开特定选项卡

问题描述

我正在使用 cbpFWTabs (http://tympanus.net/Development/TabStylesInspiration/) 但是想要在页面加载时打开特定的标签.我试图在页面中模拟这样的 show 方法，但它无法识别选项卡或项目数组:

I am using cbpFWTabs (http://tympanus.net/Development/TabStylesInspiration/) but want to open a specific tab upon page load. I have tried to emulate the show method like this in the page but it doesn't recognize the tabs or items arrays:

    <script type="text/javascript">

            // tabs elems
            this.tabs = [].slice.call( this.el.querySelectorAll( 'nav > ul > li' ) );
            // content items
            this.items = [].slice.call( this.el.querySelectorAll( '.content-wrap > section' ) );

            if( this.current >= 0 ) {
                    this.tabs[ this.current ].className = this.items[ this.current ].className = '';
            }
            // change current
            this.current = idx != undefined ? idx : this.options.start >= 0 && this.options.start < this.items.length ? this.options.start : 0;
            this.tabs[ this.current ].className = 'tab-current';
            this.items[ this.current ].className = 'content-current';
    };

    tabIndex = 1;
    showTab(tabIndex);

</script>

标签源码在这里:https://github.com/codrops/FullWidthTabs/blob/master/js/cbpFWTabs.js

我确定一定有更简单的方法?

I am sure there must be an easier way?

推荐答案

结果比我想象的要简单——只需调用锚点上的点击事件:

It turned out to be easier than I thought -- simply invoke the click event on the anchor:

$('#settings-section')[0].click();

并向锚点添加一个 id:

And adding an id to the anchor:

 <li><a id="settings-section" href="#section-bar-2" class="icon icon-box"><span>Settings</span></a></li>

这篇关于使用 cbpFWTabs 打开特定选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！