Javascript 将URL复制到其他位置后，引导Accordion不会保留在同一选项卡上
下面是我在项目中使用的引导accordion的javascript和HTML代码 问题是：如果用户位于第二个选项卡上，即Javascript 将URL复制到其他位置后，引导Accordion不会保留在同一选项卡上,javascript,html,css,twitter-bootstrap-3,accordion,Javascript,Html,Css,Twitter Bootstrap 3,Accordion,下面是我在项目中使用的引导accordion的javascript和HTML代码 问题是：如果用户位于第二个选项卡上，即相关SOP，然后打开其中的任何嵌套选项卡，然后从地址栏复制URL并将其粘贴到任何其他浏览器或同一浏览器的另一个选项卡上，则始终是第一个选项卡的嵌套选项卡，即。，QESH手册被打开，以取代第二个选项卡及其嵌套选项卡（最后一个由用户打开） 编辑 <script type="text/javascript"> $(document).ready(function
相关SOP，然后打开其中的任何嵌套选项卡，然后从地址栏复制URL并将其粘贴到任何其他浏览器或同一浏览器的另一个选项卡上，则始终是第一个选项卡的嵌套选项卡，即。，QESH手册
被打开，以取代第二个选项卡及其嵌套选项卡（最后一个由用户打开）
编辑
<script type="text/javascript">
$(document).ready(function () {
$("ul#tab li:first").addClass("aktif");
$("div.tab_icerik").hide();
$("div.tab_icerik:first").show();
$("ul#tab li").click(function (e) {
var index = $(this).index();
$("ul#tab li").removeClass("aktif");
$(this).addClass("aktif");
$("div.tab_icerik").hide();
$("div.tab_icerik:eq(" + index + ")").show();
return false
});
$(".tabv2").click(function () {
var thisId = $(this).attr('id');
var thatId = $(this).siblings().attr('id')
$('[class^="tabv2-"]').hide();
$('.' + thisId).show();
$('.tabv2').removeClass('tabv2-active');
$(this).addClass('tabv2-active');
});
$(".tabv2plain").click(function () {
var thisId = $(this).attr('id');
var thatId = $(this).siblings().attr('id')
$('[class^="tabv2plain-"]').hide();
$('.' + thisId).show();
$('.tabv2plain').removeClass('tabv2plain-active');
$(this).addClass('tabv2plain-active');
});
$(".tabv3plain").click(function () {
var thisId = $(this).attr('id');
var thatId = $(this).siblings().attr('id')
$('[class^="tabv3plain-"]').hide();
$('.' + thisId).show();
$('.tabv3plain').removeClass('tabv3plain-active');
$(this).addClass('tabv3plain-active');
});
});
</script>
<body>
<script>
function myFunction() {
window.location.hash = "#One";
//var a = "QESH MANUAL" + location.hash;
//document.getElementById("One").innerHTML = a;
}
function myFunction2() {
window.location.hash = "#Two";
}
function myFunction3() {
window.location.hash = "#collapseOne";
}
function myFunction4() {
window.location.hash = "#collapseOneOne";
}
function myFunction5() {
window.location.hash = "#collapseOneOne1";
}
function myFunction6() {
window.location.hash = "#collapseOneTwo";
}
function myFunction7() {
window.location.hash = "#collapseOneTwo1";
}
function myFunction8() {
window.location.hash = "#collapseOneTwo2";
}
function myFunction9() {
window.location.hash = "#collapseOneTwo3";
}
function myFunction10() {
window.location.hash = "#collapseOneTwo4";
}
function myFunction11() {
window.location.hash = "#collapseOneTwo5";
}
function myFunction12() {
window.location.hash = "#collapseOneTwo6";
}
function myFunction13() {
window.location.hash = "#collapseOneThree";
}
function myFunction14() {
window.location.hash = "#collapseOneThree1";
}
function myFunction15() {
window.location.hash = "#collapseOneFour";
}
function myFunction16() {
window.location.hash = "#collapseOneFour1";
}
function myFunction17() {
window.location.hash = "#collapseTwo";
}
function myFunction18() {
window.location.hash = "#collapseTwo1";
}
function myFunction19() {
window.location.hash = "#collapseThree";
}
function myFunction20() {
window.location.hash = "#collapseThree1";
}
function myFunction21() {
window.location.hash = "#collapseFour";
}
function myFunction22() {
window.location.hash = "#collapseFour1";
}
//2nd Tab Menus
function myFunction23() {
window.location.hash = "#collapseFive";
}
function myFunction24() {
window.location.hash = "#collapseFive1";
}
</script>
<div>
<div class="row" style="padding-top:5px">
<div class="col-md-12">
<ul id="tab">
<li class="">
<a onclick="myFunction()" href="#One">QESH MANUAL</a>
</li>
<li style="margin-left:3px;" class="aktif">
<a onclick="myFunction2()" href="#Two">RELATED SOPs</a>
</li>
</ul>
</div>
</div>
<div class="row" style="padding-top:5px">
<div class="tab_icerik" style="display: block;">
<div class="col-md-4">
<span style="display:block;">
<div id="accordionA1" class="panel-group">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title" style="color:#E51400; font-size:16px; font-weight:bold;">
<a data-toggle="collapse" data-parent="#accordionA1" onclick="myFunction3()" href="#collapseOne"> CONSTRUCTION</a>
</h4>
</div>
<div id="collapseOne" class="panel-collapse collapse in">
<div class="panel-body">
<!-- SECOND LEVEL ACCORDION START -->
<div id="accordionA2" class="panel-group">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordionA2" onclick="myFunction4()" href="#collapseOneOne">QESH MANUAL</a>
</h4>
</div>
<div id="collapseOneOne" class="panel-collapse collapse in">
<div class="panel-body">
<div class="group row clear" id="tabsv2plain">
<div class="tabv2plain tabv2plain-active" id="tabv2plain-1">
<a onclick="myFunction5()" href="#collapseOneOne1">QESH Manual</a>
</div>
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordionA2" onclick="myFunction6()" href="#collapseOneTwo">PROCEDURES MANUALS</a>
</h4>
</div>
<div id="collapseOneTwo" class="panel-collapse collapse">
<div class="panel-body">
<div class="group row clear" id="Div1">
<div class="tabv2plain" id="tabv2plain-2">
<a onclick="myFunction7()" href="#collapseOneTwo1">Tender & Contract Procedure Manual</a>
</div>
<div class="tabv2plain" id="tabv2plain-3">
<a onclick="myFunction8()" href="#collapseOneTwo2">Procurement Procedure Manual</a>
</div>
<div class="tabv2plain" id="tabv2plain-4">
<a onclick="myFunction9()" href="#collapseOneTwo3">Pre-Construction & Planning Procedure Manual</a>
</div>
<div class="tabv2plain" id="tabv2plain-5">
<a onclick="myFunction10()" href="#collapseOneTwo4">Project Implementation & Management Procedure Manual</a>
</div>
<div class="tabv2plain" id="tabv2plain-6">
<a onclick="myFunction11()" href="#collapseOneTwo5">Post-Construction Procedure Manual</a>
</div>
<div class="tabv2plain" id="tabv2plain-7">
<a onclick="myFunction12()" href="#collapseOneTwo6">Management System Administration Procedure Manual</a>
</div>
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordionA2" onclick="myFunction13()" href="#collapseOneThree">QESH POLICY</a>
</h4>
</div>
<div id="collapseOneThree" class="panel-collapse collapse">
<div class="panel-body">
<div class="group row clear" id="Div2">
<div class="tabv2plain" id="tabv2plain-8">
<a onclick="myFunction14()" href="#collapseOneThree1">QESH Policy</a>
</div>
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordionA2" onclick="myFunction15()" href="#collapseOneFour">QESH OBJECTIVE</a>
</h4>
</div>
<div id="collapseOneFour" class="panel-collapse collapse">
<div class="panel-body">
<div class="group row clear" id="Div3">
<div class="tabv2plain" id="tabv2plain-9">
<a onclick="myFunction16()" href="#collapseOneFour1">QESH Objective</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- SECOND LEVEL ACCORDION END -->
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title" style="color:#E51400; font-size:16px; font-weight:bold;">
<a data-toggle="collapse" data-parent="#accordionA1" onclick="myFunction17()" href="#collapseTwo">SUNWAY ENGINEERING </a>
</h4>
</div>
<div id="collapseTwo" class="panel-collapse collapse">
<div class="panel-body">
<div class="group row clear" id="Div4">
<div class="tabv2plain" id="tabv2plain-10">
<a onclick="myFunction18()" href="#collapseTwo1">QESH Manual</a>
</div>
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title" style="color:#E51400; font-size:16px; font-weight:bold;">
<a data-toggle="collapse" data-parent="#accordionA1" onclick="myFunction19()" href="#collapseThree">SUNWAY GEOTECHNICS </a>
</h4>
</div>
<div id="collapseThree" class="panel-collapse collapse">
<div class="panel-body">
<div class="group row clear" id="Div5">
<div class="tabv2plain" id="tabv2plain-11">
<a onclick="myFunction20()" href="#collapseThree1">QESH Manual</a>
</div>
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title" style="color:#E51400; font-size:16px; font-weight:bold;">
<a data-toggle="collapse" data-parent="#accordionA1" onclick="myFunction21()" href="#collapseFour">SUNWAY CONCRETE PRODUCTS </a>
</h4>
</div>
<div id="collapseFour" class="panel-collapse collapse">
<div class="panel-body">
<div class="group row clear" id="Div6">
<div class="tabv2plain" id="tabv2plain-12">
<a onclick="myFunction22()" href="#collapseFour1">QESH Manual</a>
</div>
</div>
</div>
</div>
</div>
</div>
</span>
</div>
<div class="col-md-8">
<span style="display:block; padding:10px;">
<div class="tabplaincontent">
<div class="tabv2plain-1" style="display:block;">
One Content
</div>
<div class="tabv2plain-2" style="display:none;">
Two Content
</div>
<div class="tabv2plain-3" style="display:none;">
Three Content
</div>
<div class="tabv2plain-4" style="display:none;">
Four Content
</div>
<div class="tabv2plain-5" style="display:none;">
Five Content
</div>
<div class="tabv2plain-6" style="display:none;">
Six Content
</div>
<div class="tabv2plain-7" style="display:none;">
Seven Content
</div>
<div class="tabv2plain-8" style="display:none;">
Eight Content
</div>
<div class="tabv2plain-9" style="display:none;">
Nine Content
</div>
<div class="tabv2plain-10" style="display:none;">
Ten Content
</div>
<div class="tabv2plain-11" style="display:none;">
Eleven Content
</div>
<div class="tabv2plain-12" style="display:none;">
Twelve Content
</div>
</div>
</span>
</div>
</div>
<div class="tab_icerik" style="display: none;">
<div class="col-md-4">
<span style="display:block;">
<div id="accordionB1" class="panel-group">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title" style="color:#E51400; font-size:16px; font-weight:bold;">
<a data-toggle="collapse" data-parent="#accordionB1" onclick="myFunction23()" href="#collapseFive">FINANCE & ADMIN</a>
</h4>
</div>
<div id="collapseFive" class="panel-collapse collapse in">
<div class="panel-body">
<div class="group row clear" id="tabsv3plain">
<div class="tabv3plain" id="tabv3plain-1">
<a onclick="myFunction24()" href="#collapseFive1">General</a>
</div>
</div>
</div>
</div>
</div>
</div>
</span>
</div>
<div class="col-md-8">
<span style="display:block; padding:10px;">
<div class="tabplaincontent">
<div class="tabv3plain-1" style="display:block;">
Thirteen Content
</div>
<div class="tabv3plain-2" style="display:none;">
Fourteen Content
</div>
<div class="tabv3plain-3" style="display:none;">
Fifteen Content
</div>
<div class="tabv3plain-4" style="display:none;">
Sixteen Content
</div>
</div>
</span>
</div>
</div>
</div>
</div>
同样，当我复制URL（其中包括每个选定选项卡的唯一名称）时，始终会打开第一个手风琴选项卡，即构造-->Quesh Manual-->Quesh Manual；代替用户上次选择的选项卡。同样的问题依然存在
任何帮助都将不胜感激，因为您没有阅读$（document.ready
中的url哈希。您需要检查url是否包含特定选项卡/项目的哈希，并将其激活。默认情况下，您总是打开第一个选项卡/第一个项目，因为您没有在$（document.ready
中读取url哈希。您需要检查url是否包含特定选项卡/项目的哈希，并将其激活。默认情况下，始终打开第一个选项卡/第一个项目
localhost:49963/Test.aspx#collapseThree1