Question

我正在使用twitter bootstrap，我希望在点击活动标签时关闭活动标签内容。

我使用此代码，但这不起作用：

$('#myTab a').click(function (e) {
    if ($(this).parent('li').hasClass('active')) {
        $($(this).attr('href')).removeClass('active');
        $(this).parent('li').removeClass('active');
    } else {
        e.preventDefault();
        $(this).tab('show');
    }
});

Answer 1

这是有效但不完美。我编辑bootstrap.js并替换此

  $(document).on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
    e.preventDefault()
    $(this).tab('show')
  })

这一个

      $(document).on('click.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
  e.preventDefault();
      if($(this).parent('li').hasClass('active')){

       $( $(this).attr('href') ).removeClass('active'); 
        $(this).parent('li').removeClass('active');
       if ( $(this).parent('.dropdown-menu') ) {
              $(this).closest('li.dropdown').removeClass('active')
            }
        }
        else {
            e.preventDefault();
            $(this).tab('show');
        }
      })

但我也希望如果下拉选项卡的子菜单处于活动状态，当我点击该下拉选项卡时，“活动”类应从该下拉选项卡中删除，并且该子菜单选项卡内容。

抱歉英语不好。

Answer 2

这对我有用。删除＆＃34;活跃＆＃34;上课做得更好

$('#myTab a').click(function (e) {
  if($(this).parent('li').hasClass('active')){
    $(this).removeClass('active')
    $( $(this).attr('href') ).removeClass('active');
  }
  else {
    e.preventDefault();
    $(this).tab('show');
  }
});

您可以在此处查看http://jsfiddle.net/tekbreak/NQ97h/182/

但如果您需要在每个选项卡选择器上进行，请使用此jQuery选择器

$('a[data-toggle="tab"]').click(...

单击活动选项卡时关闭活动选项卡内容 - twitter bootstrap

2 个答案: