开发者

Using multiple tab-blocks on the same page (jQuery)

开发者 https://www.devze.com 2023-01-16 03:02 出处:网络
$(\'.tabbed-block .tab-content:first\').show(); $(\'.tabbed-block ol li:first\').addClass(\'active\');
$('.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开发者_JAVA百科');
                $('.tabbed-block .tab-content').hide();
                $(a).show();
                return false;
            });

.. works great, but not if used more than once of the same page, interferes with each other. What should I change?

Thanks!


This should work. Although, why aren't you just using jQuery UI Tabs?

$('.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;
  });
});
0

精彩评论

暂无评论...
验证码 换一张
取 消