Question

我在一个页面中有多个标签，但在设置所选菜单的活动类时遇到问题。如果我只有一套标签，它的工作效果很好。如果单击第一个选项卡菜单，第二个选项卡菜单将丢失其活动类。淡入效果也不起作用。请帮忙。谢谢。 Fiddle here

$(".tabs a").click(function() {
  $(".tabs a").parent().removeClass("active");
  $(this).parent().addClass("active").fadeIn('slow');
});

Answer 1

尝试此操作来修复选项卡的选择：

$(".tabs a").click(function () {
    $(this).closest('ul').find('li').removeClass("active");
    $(this).parent().addClass("active").fadeIn('slow');
    $(this).closest('ul').next(".tabInner").find("div").eq($(this).parent().index()).hide().fadeIn('slow');
});

<强> jsFiddle example

Answer 2

这样做

$(".tabs a").click(function(e) {
   e.preventDefault();
   var p = $(this).closest('.tabs');
   var i = '#'+$(this).attr('data-tab');

   $(this).closest('ul').find('li').removeClass("active");
   $(this).parent().addClass('active');
   $(p).find('.tabInner div').hide();
   $(p).find(i).fadeIn('slow');
});

<强> JFIDDLE EXAMPLE

如何在一个页面中将活动类设置为多个选项卡？

2 个答案: