[解決済み] Twitter Bootstrap - タブ - URLが変更されない
2022-10-07 18:17:55
質問
Twitter Bootstrapのquot;tabs"を使用しています。
私は以下のコードを持っています。
<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#add">add</a></li>
<li><a data-toggle="tab" href="#edit" >edit</a></li>
<li><a data-toggle="tab" href="#delete" >delete</a></li>
</ul>
タブは正常に動作しますが、URL内に#add, #edit, #deleteが追加されません。
を削除すると
data-toggle
を削除すると、URLは変更されますが、タブは機能しません。
何か解決策があれば教えてください。
どのように解決するのですか?
このコードを試してみてください。これは、URLへのタブのhrefを追加し、ページロード時にハッシュに基づいてタブを開きます。
$(function(){
var hash = window.location.hash;
hash && $('ul.nav a[href="' + hash + '"]').tab('show');
$('.nav-tabs a').click(function (e) {
$(this).tab('show');
var scrollmem = $('body').scrollTop() || $('html').scrollTop();
window.location.hash = this.hash;
$('html,body').scrollTop(scrollmem);
});
});
関連
-
Uncaught SyntaxError: 予期しない入力の終了
-
[解決済み] jQueryで現在のURLを取得する?
-
[解決済み] Twitter Bootstrapのメニューをクリックではなく、ホバーでドロップダウンさせる方法
-
[解決済み] Twitter Bootstrap 3を使用して列を中央に配置する
-
[解決済み] セレクトボックスのオプションをすべて削除してから、オプションを1つ追加して、jQueryで選択するにはどうすればよいですか?
-
[解決済み] Twitter Bootstrapでナビバーの色を変更する
-
[解決済み] Twitter Bootstrapのモーダルクローズに関数をバインドする
-
[解決済み] jQueryを使用してテキストボックスの値を取得するには?
-
[解決済み】Twitter Bootstrapのツールチップを動的に作成された要素に結合するにはどうすればよいですか?
-
[解決済み] Bootstrap 3 のスタックドタブ
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Uncaught TypeError: 未定義のプロパティ 'length' を読み取れませんでした。
-
[解決済み] Google Maps APIでマウスのスクロールホイールによる拡大縮小を無効にする方法
-
[解決済み] jQueryを使用してspanに値を設定する方法
-
[解決済み] JavaScriptでwindow.location(URL)からハッシュを削除する方法 ページを更新せずに?
-
[解決済み] Twitter Bootstrapのタブ:ページの再読み込みやハイパーリンクで特定のタブに移動する
-
[解決済み] jQueryでval()がchange()をトリガーしない
-
[解決済み] jQueryで、ある要素を他の要素に対して相対的に配置するには?
-
[解決済み] jQuery / JavaScriptでJSONデータをパースする方法は?
-
[解決済み】フォームのhiddenフィールドにjQueryの".val() "を使って値を設定してもうまくいかない。
-
[解決済み] Bootstrap 3: ページ更新時に選択したタブを保持する