[英]Open an active tab from external link
我正在使用引導程序3在一個項目上工作。我想從“主頁”頁面鏈接到特定的打開選項卡。 我閱讀並測試了很多機會,但沒有任何效果。
我的最新消息:
$activetabbuehne = (params.activeTab is null or params.activeTab == 'tab_a') ? 'class="active"' : ''; $activetabhoehe = (params.activeTab == 'tab_b') ? 'class="active"' : ''; $activetabaudio = (params.activeTab == 'tab_c') ? 'class="active"' : ''; $activetabstudio = (params.activeTab == 'tab_d') ? 'class="active"' : ''; $activetabsonder = (params.activeTab == 'tab_e') ? 'class="active"' : ''; $activetabinstall = (params.activeTab == 'tab_f') ? 'class="active"' : '';
<ul class="nav nav-pills nav-stacked col-xs-12 col-md-4"> <li $activetabbuehne><a href="#tab_a" data-toggle="pill" style="font-weight:500;">BÜHNENBAU<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li> <li $activetabhoehe><a href="#tab_b" data-toggle="pill" style="font-weight:500;">HÖHENARBEITEN<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 26px;color: #db001b;">+</span></a></li> <li $activetabaudio><a href="#tab_c" data-toggle="pill" style="font-weight:500;">AUDIO-, VIDEO-, LICHTTECHNIK<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li> <li $activetabstudio><a href="#tab_d" data-toggle="pill" style="font-weight:500;">STUDIO<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li> <li $activetabsonder><a href="#tab_e" data-toggle="pill" style="font-weight:500;">SONDERLÖSUNGEN<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li> <li $activetabinstall><a href="#tab_f" data-toggle="pill" style="font-weight:500;">INSTALLATIONEN<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li> </ul>
這是我用於dev.page上的測試的鏈接:
https://amphire.de/dev/leistungen/?activeTab=tab_a
感謝您的幫助。
一種可能的JavaScript解決方案是,在參數指定的鏈接上觸發click事件。 它將像這樣工作:
這將是一個示例代碼:
<ul class="nav nav-pills nav-stacked col-xs-12 col-md-4">
<li><a href="#tab_a" data-toggle="pill" style="font-weight:500;">BÜHNENBAU<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li>
<li><a href="#tab_b" data-toggle="pill" style="font-weight:500;">HÖHENARBEITEN<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 26px;color: #db001b;">+</span></a></li>
<li><a href="#tab_c" data-toggle="pill" style="font-weight:500;">AUDIO-, VIDEO-, LICHTTECHNIK<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li>
<li><a href="#tab_d" data-toggle="pill" style="font-weight:500;">STUDIO<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li>
<li><a href="#tab_e" data-toggle="pill" style="font-weight:500;">SONDERLÖSUNGEN<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li>
<li><a href="#tab_f" data-toggle="pill" style="font-weight:500;">INSTALLATIONEN<span style="font-weight:500; float:right;font-weight: 700;float: right;font-size: 23px;color: #db001b;">+</span></a></li>
</ul>
<script type="text/javascript">
// function from https://stackoverflow.com/a/979997/3695983
function gup( name, url ) {
if (!url) url = location.href
name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
var regexS = "[\\?&]"+name+"=([^&#]*)";
var regex = new RegExp( regexS );
var results = regex.exec( url );
return results == null ? null : results[1];
}
// get the value of the activeTab parameter
var targetTab = gup("activeTab", window.location.href);
// trigger the click so that tab activates and shows content
$("a[href='#" + targetTab + "']").click();
</script>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.