代码之家  ›  专栏  ›  技术社区  ›  eozzy

在同一页上使用多个选项卡块(jQuery)

  •  0
  • eozzy  · 技术社区  · 14 年前
    $('.tabbed-block .tab-content:first').show();
                $('.tabbed-block ol li:first').addClass('active');
                $('.tabbed-block ol li a').click(function () {
                    $('.tabbed-block ol li').removeClass('active');
                    $(this).parent().addClass('active');
                    var a = $(this).attr('href');
                    $('.tabbed-block .tab-content').hide();
                    $(a).show();
                    return false;
                });
    

    谢谢!

    1 回复  |  直到 14 年前
        1
  •  1
  •   BBonifield    14 年前

    这应该管用。不过,为什么不直接使用jqueryui选项卡呢?

    $('.tabbed-block').each(function(){
      var $block = $(this);
      $block.find('.tab-content:first').show();
      $block.find('ol li:first').addClass('active');
      $block.find('ol li a').click(function () {
        var $link = $(this);
        $link.closest('ol').find('li a').removeClass('active');
        $link.parent().addClass('active');
        var a = $link.attr('href');
        $link.closest('.tabbed-block').find('.tab-content').hide();
        $(a).show();
        return false;
      });
    });