Как связать конкретную вкладку с помощью jquery

Question

У меня есть 2 html-страницы. Page 1 имеет 3 вкладки с содержимым. Когда я нажимаю на вкладку 3, есть ссылка, которая выводит меня на новую страницу. На новой странице есть кнопка «возврат», и когда я нажимаю на кнопку, она возвращает меня на предыдущую страницу, однако активна вкладка №1. Есть ли способ сделать это, когда я нажимаю кнопку «возврат», вкладка № 3 активна, а не табуляция # 1.

enter code here 
    //page 1: 
    <ul class="nav nav-tabs tabSet" role="tablist" id="myTab"> 
    <li class="active"><a href="#tab-1" role="tab" data-toggle="tab">tab2</a></li> 
    <li><a href="#tab-2" role="tab" data-toggle="tab">tab2</a></li> 
    <li><a href="#tab-3" role="tab" data-toggle="tab" id="up">tab3</a> </li> 

//page 2: 
    enter code here <input type="button" id="`Button" name="returnButton" value="Return to Report" onclick="returnToPrevious()" class="btn btn-primary" /> 

    <script type="text/javascript"> 
    function returnToPrevious() 
{ 
    parent.history.back(); 
    return false; 
} 
</script> 

большое спасибо

Answer 1

Вы можете сделать это, играя со строкой запроса URL: если URL содержит некоторый параметр, то активна вкладка третий.

Предполагая, что первая страница называется first-page.html, вы можете изменить яваскрипт кода второй страницы таким образом:

<script type="text/javascript"> 

function returnToPrevious() 
{ 
    location.href = "first-page.html?back=yes"; 
    return false; 
} 

</script> 

А в первой странице вы можете активен первые или третья таблица оценку, если back=yes часть присутствует или нет в адресе:

<!-- Notice that the class "active" is not present, because it will be managed in the javascript --> 
<ul class="nav nav-tabs tabSet" role="tablist" id="myTab"> 
    <li><a href="#tab-1" role="tab" data-toggle="tab">tab1</a></li> 
    <li><a href="#tab-2" role="tab" data-toggle="tab">tab2</a></li> 
    <li><a href="#tab-3" role="tab" data-toggle="tab" id="up">tab3</a></li> 
</ul> 


<script type="text/javascript"> 

// Function that takes a param value from the query string of the url 
// source: https://css-tricks.com/snippets/javascript/get-url-variables/ 
function getQueryStringVariable(variable) 
{ 
    var queryString = window.location.search.substring(1); 
    var vars = queryString.split("&"); 
    for (var i=0;i<vars.length;i++) { 
     var pair = vars[i].split("="); 
     if(pair[0] == variable){ 
      return pair[1]; 
     } 
    } 
    return false; 
} 


// Checks if the "back=yes" part in the url is present 
var back = getQueryStringVariable("back"); 
if (back === "yes") 
{ 
    $("a[href=#tab-3]").addClass("active"); 
} 
else 
{ 
    $("a[href=#tab-1]").addClass("active"); 
} 

</script>