在这里有个问题，现在先来看看这个（框架是Bootstrap 3）：
http://www.shy48.com/member_list.html
there's a bootstrap tab on this page, and the tab contains two Team Member Lists, after clicked a member's photo, user will be redirected to another page which contains more Personal Intro; and what I was asked to do is when return from the Personal Intro Page to Team Member Lists Page by clicking the "backward arrow" on top left corner of a browser, a Team List shall be remained while another Team list is hidden, e.g. if returned from a Purple team member's more Personal Intro Page to the List page, the Purple team list shall be display and pink team shall be hidden, and the same behavior shall be done on the pink team member's more Personal Intro.
One solution I could think of is to use the sessionStorage as following:
1. Insert this code in the More Member Personal Intro Page:
<script type="text/javascript">
// "hiii" can be dynamically changed by phper
sessionStorage.setItem("team","hiii");
</script>
2. Insert this code in the Member List Page:
<script type="text/javascript">
$(document).ready(function(){
// get the switch indicator
var siiiLi = $("#memberTab li:nth-child(1)"),
hiiiLi = $("#memberTab li:nth-child(2)"),
// get the trigger
siiiAtag = $("#memberTab li:nth-child(1) a"),
hiiiAtag = $("#memberTab li:nth-child(2) a");
// get the panes
siiiPane = $("#SIII");
hiiiPane = $("#HIII");
// access the team obj
//localStorage.clear();
/* */
var team = sessionStorage.getItem("team");
console.log(team);
//while returned from a siii member details
if(team == "siii"){
console.log("Returned From SIII member detail");
//remove hiii classes
hiiiLi.removeClass("active");
hiiiAtag.attr("aria-expanded","false");
hiiiPane.removeClass("in");
hiiiPane.removeClass("active");
// add siii classes
siiiLi.addClass("active");
siiiAtag.attr("aria-expanded","true");
siiiPane.addClass("in");
siiiPane.addClass("active");
hiiiPane.hide();
siiiPane.show();
}
// while returned from a hiii member details
else if(team == "hiii"){
console.log("Returned From HIII member detail");
//remove siii classes
siiiLi.removeClass("active");
siiiAtag.attr("aria-expanded","false");
siiiPane.removeClass("active");
siiiPane.removeClass("in");
// add hiii classes
hiiiLi.addClass("active");
hiiiAtag.attr("aria-expanded","true");
hiiiPane.addClass("active");
hiiiPane.addClass("in");
//alert("!!");
//siiiPane.hide();
//hiiiPane.show();
}
// while returned from a yiii member details
/*
else if (team === "yiii"){
alert ("Returned From YIII member detail");
}
*/
else{
// ...... hehehe ......
} /* */
});
</script>
3. Here is the HTML structure:
3.1 tab pane trigger(pink & purple logos):
<ul id="memberTab" class="col-md-8 col-xs-8">
<!-- style="background-color: lightseagreen;" -->
<li class="col-md-4 col-xs-4 col-md-offset-2 col-xs-offset-2 active">
<!-- style="background-color:lightblue;" -->
<a href="#SIII" data-toggle="tab" class="col-md-12 col-xs-12" aria-expanded="true">
<img src="http://www.shy48.com/Public/home/img/membersPage/MembersBox_4RightSIII.png">
<!-- class="img-responsive"-->
</a>
</li>
<li class="col-md-4 col-xs-4">
<a href="#HIII" data-toggle="tab" class="col-md-12 col-xs-12" aria-expanded="false">
<!-- style="background-color:lightpink;" -->
<img src="http://www.shy48.com/Public/home/img/membersPage/MembersBox_4RightHIII.png">
<!--class="img-responsive"-->
</a>
</li>
</ul>
3.2 tab-pane tages:
<div class="tab-pane fade active in" id="SIII" style="background-image:
url(http://www.shy48.com/Public/home/img/membersPage/memberPageBox_5SIIIBackgroundImg.png);background-repeat:no-repeat;background-position:bottom right;"><div class="col-md-12 col-xs-12" style="padding-right:0px;">
<div class="tab-pane fade" id="HIII" style="background-image: url(http://www.shy48.com/Public/home/img/membersPage/memberPageBox_4HIIIBackgroundImg.png);background-repeat:no-repeat;background-position:bottom right;">
现在，我可以制作＃memberTab的li＆amp;元素类（li .active）＆amp;可以使用jQuery代码修改attribute（aria-expanded =“false / true”），但是，＃myTabContent中的div类根本不会被修改。 sessionStorage更多会员的关键和价值个人简介可以在会员列表页面上访问。
我想这个问题存在于#myTabContent的某个地方，但我找不到它，请有人帮忙吗？