我正在使用 jQuery 选项卡，在我的一个选项卡上有一个功能可以刷新页面，然后在刷新后显示相同的选项卡。
这是我目前所拥有的，但它似乎没有将选项卡设置为事件状态:
setTimeout(function(){
location.reload();
$("#tabs").tabs({ active: 1});
}, 1000);
我的标签:
<div id="tabs">
<ul id ="tabList" style="line-height: 3.3;">
<li><a href="#tabs-1">Carrier Details</a></li>
<li><a href="#tabs-2">Contacts</a></li>
</ul>
<%--This is Carrier Details Tab--%>
<div id="tabs-1">
<%@include file="carrierProfileDetails.jspf" %>
</div>
<%--This is Contacts Tab--%>
<div id="tabs-2">
<%@include file="carrierProfileContacts.jspf" %>
</div>
</div>
我希望在刷新后显示联系人选项卡。
最佳答案
您可以使用 sessionStorage对于您的情况，您可以设置/获取/更新数据，刷新后即可访问。这是一个简单的例子，但它在代码片段中不起作用，你可以在本地创建 HTML 页面并检查它(它在本地工作正常):
<body>
<h1>Active tab: <span id="tab-number"></span></h1>
<button onclick="changeTab('1')">Tab 1</button>
<button onclick="changeTab('2')">Tab 2</button>
<button onclick="changeTab('3')">Tab 3</button>
<script>
var ssActiveTab = sessionStorage.getItem('activeTab');
if (ssActiveTab) {
changeTab(ssActiveTab);
}
function changeTab(newTab) {
document.getElementById('tab-number').innerText = newTab;
sessionStorage.setItem('activeTab', newTab);
}
</script>
</body>主要思想是在每次更改时将选项卡的当前状态设置为 sessionStorage，并在页面加载时从中获取最后状态。如果项目存在并具有值 - 然后根据此数据设置状态。
关于javascript - 使用 setTimeout 刷新页面后，显示页面刷新前显示的选项卡，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49905409/