Question

我有以下标签代码：

<div class="block_tabs_type_1">
<div class="tabs">
    <ul>
        <li><a href="#1" class="current"><span>First Tab</span></a></li><!-- tab link -->
        <li><a href="#2"><span class="icon cloud"></span></a></li><!-- tab link -->
        <li><a href="#3"><span>Nested Shortcodes</span></a></li><!-- tab link -->
    </ul>
</div>

<div class="tab_content">
    <!-- tab content goes here -->
    <p>Duis r inceptos himenaeos.</p>
</div>

<div class="tab_content">
    <!-- tab content goes here -->
    <p>Duis tincidunt er p elit.</p>
</div>

<div class="tab_content">
    <!-- tab content goes here -->
    <p>Duis tincidunt e inceptos himenaeos.</p>
</div>

<script type="text/javascript">
    jQuery('.block_tabs_type_1 .tabs').tabs('.block_tabs_type_1 .tab_content', {
        initialIndex : 0
    });
</script>

我希望在同一页面添加另一个标签块，但是我很难让JS正常运行。

有人可以提供建议吗？

Answer 1

最简单的方法是简单地使用不同的选择器并调用它两次。

示例：

<script type="text/javascript">
    jQuery('.block_tabs_type_1 .tabs').tabs('.block_tabs_type_1 .tab_content', {
        initialIndex : 0
    });
    jQuery('.block_tabs_type_2 .tabs').tabs('.block_tabs_type_2 .tab_content', {
        initialIndex : 0
    });
</script>

jQuery选项卡 - 同一页面上的多个选项卡块

1 个答案: