Jquery选项卡不会记住新页面加载时上次打开的选项卡
Jquery选项卡不会记住新页面加载时上次打开的选项卡
提问于 2013-03-23 06:46:44
我将JS用于一些简单的Jquery选项卡，在开发过程中，我将其用作网站上的主垂直导航栏。
我有两个主要的标签，‘标签1’(左边)和‘标签2’(右边)。在这些选项卡中的每个选项卡上都有链接到网站各个页面的子链接。
所以我问题是，每当我点击“tab 2”中的链接时，当新页面加载时，导航栏默认会恢复到“tab 1”。
我希望它能让我从“标签2”点击的任何链接，在加载时导航栏默认显示为“标签2”。
我的JS在这里：
$(document).ready(function() {
$(".tab-content").hide();
$("ul.tabs li:first").addClass("active").show();
$(".tab-content:first").show();
$("ul.tabs li").click(function() {
$("ul.tabs li").removeClass("active");
$(this).addClass("active");
$(".tab-content").hide();
var activeTab = $(this).find("a").attr("href");
$(activeTab).fadeIn();
return false;
});});我们将非常感谢您的帮助。
下面是HTML：
<!-- START TABS -->
<div class="tabbz">
<ul class="tabs">
<li><a href="#tab1">サービス内容</a></li>
<li class="active"><a href="#tab2">ご利用案内</a></li>
</ul>
<div class="tab-container">
<div id="tab1" class="tab-content">
<ul>
<li>
<a href="/a.php">転送サービス</a>
<a href="/b.php">お買い物サービス</a>
<ul>
<li><a href="/b1.php">卸売・仕入れサポート</a></li>
<li><a href="/b2.php">国際展示会サポート</a></li>
</ul>
</li>
</ul>
</div>
<div id="tab2" class="tab-content">
<ul>
<li><a href="/c.php">ご利用ガイド</a>
<ul>
<li><a href="/c1.php">個人輸入とは</a></li>
<li><a href="/c2.php">サービスの流れ</a></li>
</ul>
</li>
<li><a href="/d.php">料金ガイド</a>
<ul>
<li><a href="/d1.php">手数料について</a></li>
<li><a href="/d2.php">換算レート</a></li>
</ul>
</li>
</ul>
</div>
</div>
</div>回答 3
Stack Overflow用户
回答已采纳
发布于 2013-03-23 11:49:45
您可以更改此行
$("ul.tabs li:first").addClass("active").show(); 至
$("ul.tabs li.active").show();在您的html中只需将class="active"添加到li
<li class="active">Stack Overflow用户
发布于 2013-03-23 06:50:06
好吧，一个新的页面加载发生了，所以选项卡从头开始重新初始化。您必须以某种方式在页面之间传递选定的选项卡-或者在URL中作为片段或参数传递，或者在cookie中传递，然后读取值并在初始化选项卡时使用它。
Stack Overflow用户
发布于 2013-03-23 06:53:45
在每个页面上，您可以添加一些属性或唯一标识该页面的内容，如<body id="contact">。
修改js中的内容，根据主体id添加活动类。
$("ul.tabs li."+$('body').attr('id')).addClass("active").show(); 页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/15581065
复制相关文章
相似问题
腾讯云开发者
