刷新頁面後，該選項卡未激活 - jquery

Question

我試圖在刷新頁面後顯示profile選項卡，但頁面在頁面加載之前處於活動狀態，之後未激活。

但我打電話location.reload()後activeTab功能。 有何建議？

$(document).on('click', '#Generate', function(e) { 
    alert('hello'); 
    setTimeout(function() { 
    window.setTimeout(function() { 
     location.reload(); 
    }, 500); 
    activeTab('profile'); 
    }, 2000); 

}); 


function activeTab(tabID) { 
    $('.nav-tabs a[href="#' + tabID + '"]').tab('show'); 
}; 

<button id="Generate"> 
     Click 
    </button> 
<p> 
    &nbsp; 
</p> 
<ul class="nav nav-tabs" id="myTab"> 
    <li class="active"><a href="#home" data-toggle="tab">Home</a></li> 
    <li><a href="#profile" data-toggle="tab">Profile</a></li> 
</ul> 

<div class="tab-content"> 
    <div class="tab-pane active" id="home">Home</div> 
    <div class="tab-pane" id="profile">Profile</div> 
</div> 

Answer 1

在這裏，你去了一個解決方案https://jsfiddle.net/0erervmb/

activeTab = function(tabID) { 
 
    $('#myTab ul li a[href="#' + tabID + '"]').click(); 
 
} 
 

 
$(document).on('click', '#Generate', function(e) { 
 
    setTimeout(function() { 
 
    window.setTimeout(function() { 
 
     location.reload(); 
 
    }, 500); 
 
    localStorage.setItem('activeTab', 'profile'); 
 
    activeTab('profile'); 
 
    }, 2000); 
 

 
}); 
 

 
$('#myTab').tabs(); 
 

 
if(localStorage.getItem('activeTab') != null){ 
 
\t activeTab(localStorage.getItem('activeTab')); 
 
}

<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 
<button id="Generate"> 
 
     Click 
 
    </button> 
 
<p> 
 
    &nbsp; 
 
</p> 
 
<div id="myTab"> 
 
    <ul> 
 
    <li class="active"><a href="#home" data-toggle="tab">Home</a></li> 
 
    <li><a href="#profile" data-toggle="tab">Profile</a></li> 
 
    </ul> 
 

 
    <div class="tab-content"> 
 
    <div class="tab-pane active" id="home">Home</div> 
 
    <div class="tab-pane" id="profile">Profile</div> 
 
    </div> 
 
</div>

點要注意

• 我修改了HTML了一下。
• 請加$('#myTab').tabs();
• 用於localStorage用於重新加載後的上次激活選項卡。

二更新https://jsfiddle.net/0erervmb/1/

$(document).on('click', '#Generate', function(e) { 
 
    setTimeout(function() { 
 
    window.setTimeout(function() { 
 
     location.reload(); 
 
    }, 500); 
 
    localStorage.setItem('activeTab', 'profile'); 
 
    }, 2000); 
 

 
});

只是刪除activeTab('profile');

希望這會幫助你。