在URL链接的基础上激活Bootstrap选项卡

我有引导标签,我想在URL链接的基础上激活标签.

例如:

xyz.xxx/index#tab2应该在页面加载时激活tab2.

到目前为止,这是我的代码

  

    

      
Tab 1
      
Tab 2
      
Tab 3
    
  
  

    

      
 hello 1
    

    

      
 hello 2
    

    

      
Hello 3
    
  
 

默认情况下它使tab1处于活动状态,因此在我的情况下可能会根据我的URL链接默认激活第二个选项卡.

假设我将#tab2放在URL中,那么它应该在页面加载时默认使tab2处于活动状态.

你可以使用像这样的jquery来实现它.您的网址,例如"www.myurl.com/page#tab1";

var url = window.location.href;

从网址链接获取标签以激活.

 var activeTab = url.substring(url.indexOf("#") + 1);

删除旧的活动Tab类

 $(".tab-pane").removeClass("active in");

将活动类添加到新选项卡

$("#" + activeTab).addClass("active in");

或者在获得activeTab后直接打开选项卡.

$('a[href="#'+ activeTab +'"]').tab('show')