Question

我正在网站上开发一个块多个标签，以显示每个标签上包含X个帖子的一些类别。

我不太了解javascript，我发现这会在标签上产生效果

<script type="text/javascript">
$(document).ready(function(){
    $("a.maintab").click(function () { // When a link is clicked
        $(".tabactive").removeClass("tabactive"); // switch all tabs off
        $(this).addClass("tabactive"); // switch this tab on
        $(".maintabcontent").slideUp(); // slide all content up
        var content_show = $(this).attr("title"); // slide this content up
        $("#"+content_show).slideDown();
    });
  });
</script>

问题是，当我有两个块时，每个块都有不同的标签，如果我在第二个块上选择了一个标签，则第一个关闭（向上滑动），反之亦然。

我希望他们永远是开放的，不管我选择了什么标签。你可以帮我解决这个问题吗？顺便说一句幻灯片效果并不重要，你可以在它上面设置toggle（）。

编辑：http://paste2.org/Y3J1Lm7d

这是一个块的样本

Answer 1

~~所以从我可以收集的内容中你只想将标签用作“按钮”而不会实际影响下面内容的“块”？~~

~~在这种情况下，只需删除处理内容上下滑动的行。~~

这个javascript应该可行

<script type="text/javascript">
$(document).ready(function(){
    $("a.maintab").click(function () { // When a link is clicked
        $(".tabactive").removeClass("tabactive"); // switch all tabs off
        $(this).addClass("tabactive"); // switch this tab on

        var content_show = $(this).attr("title"); // id of the linked content
        $("#"+content_show).siblings().slideUp(); // slide siblings up
        $("#"+content_show).slideDown(); // slide itself down
    });
  });
</script>

如果这些是标签内容的两个块：

<div id="TabElements1">
    <div id="maintab1" class="maintabcontent">
        {custom category="2" aviable="main" from="0" limit="16" order="rating" cache="no"}
    </div>
    <div id="maintab2" class="maintabcontent">
        {custom category="3" aviable="main" from="0" limit="16" cache="no"}
    </div>
</div>

<div id="TabElements2">
    <div id="maintab3" class="maintabcontent">
        {custom category="2" aviable="main" from="0" limit="16" order="rating" cache="no"}
    </div>
    <div id="maintab4" class="maintabcontent">
        {custom category="3" aviable="main" from="0" limit="16" cache="no"}
    </div>
</div>

请参阅小提琴：http://jsfiddle.net/Cz5te/2/

Javascript不同的选项卡块

1 个答案: