☰

Twitter Bootstrap タブ: ページの再読み込みまたはハイパーリンクで特定のタブに移動する質問する

tag-icon • tag-icon javascript html tabs twitter-bootstrap
Twitter Bootstrap タブ: ページの再読み込みまたはハイパーリンクで特定のタブに移動する質問する

私はTwitterのBootstrap Frameworkとそれを使用したウェブページを開発しています。Bootstrap タブ JSいくつかの小さな問題を除けば、うまく機能します。そのうちの 1 つは、外部リンクから特定のタブに直接移動する方法がわからないことです。例:

<a href="facility.php#home">Home</a>
<a href="facility.php#notes">Notes</a>

外部ページからのリンクをクリックすると、それぞれホームタブとノートタブに移動する

ベストアンサー1

問題に対する私の解決策は、少し遅いかもしれませんが、他の人の役に立つかもしれません。

// Javascript to enable link to tab
var hash = location.hash.replace(/^#/, '');  // ^ means starting, meaning only match the first hash
if (hash) {
    $('.nav-tabs a[href="#' + hash + '"]').tab('show');
} 

// Change hash for page-reload
$('.nav-tabs a').on('shown.bs.tab', function (e) {
    window.location.hash = e.target.hash;
})

おすすめ記事