0

我正在尝试制作可以在页面上重复使用的标签。我已经看到了一个名为 tab1 的 id 的示例，它对应于内容 id 名为 tabContent1 的位置，但内容将动态加载，因此我无法控制页面上将有多少个选项卡。我有我希望通过页面重用的 html 的结构，但不知道如何构建 js。最终，所有内容选项卡都会在页面加载时关闭，然后一旦单击选项卡，它就会向下滑动相应的内容。

<div class="tabContainer">
    <div class="tabMenu">
        <div class="tab">Tab 1</div>
        <div class="tab">Tab 2</div>
        <div class="tab">Tab 3</div>
    </div><!-- class="tabMenu" -->
    <div class="tabContent">
        <div class="tabBlock">Tab Content 1</div>
        <div class="tabBlock">Tab Content 2</div>
        <div class="tabBlock">Tab Content 3</div>
    </div><!-- class="tabContent" -->
</div><!-- class="tabContainer" -->

如果必须重新构建 html 结构，那很好。

对此的任何帮助将不胜感激。

4

0 回答 0