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

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

tabs jquery javascript

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 年前

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;
  });
});

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

4 月前

Dr.0000FF · jQuery按钮点击不显示/隐藏内容

5 月前

user28928120 · 如何在jquery中选择所有类?

5 月前

LauraNMS · 如何使用Waypoints js实现粘性元素和偏移量

5 月前