[解決済み] ページ読み込み時のアンカー "ジャンプ "を無効にするには?
2022-09-03 02:15:55
質問
私はこれが可能ではないかもしれないと思う、私ができる限り説明しようとします。 私はタブを含むページを持っています(jquery powered)、以下によって制御されます。
私はこのコードを使用しています、以前の質問から別のユーザーによって提供されたように。
<script type="text/javascript">
$(function() {
$('html, body').animate({scrollTop:0}); // this is my "fix"
var tabContent = $(".tab_content");
var tabs = $("#menu li");
var hash = window.location.hash;
tabContent.not(hash).hide();
if(hash=="") {
$('#tab1').fadeIn();
}
tabs.find('[href=' + hash + ']').parent().addClass('active');
tabs.click(function() {
$(this).addClass('active').siblings().removeClass('active');
tabContent.hide();
var activeTab = $(this).find("a").attr("href");
$(activeTab).fadeIn();
return false;
});
});
</script>
このコードは、私が直接"tabs"ページを訪問したときにうまく動作します。
しかし、私は他のページから個々のタブにリンクする必要があります - これを行うために、このコードは
window.location.hash
を取得し、適切なタブを表示します。
を実行すると、"return false"のため、ページはアンカーに "jump" しない。
このイベントは、クリック イベントでのみトリガーされます。したがって、他のページから私の "tabs" にアクセスすると、"jump" の効果がトリガーされます。これに対処するために、私は自動的にページの一番上までスクロールしますが、これが起こらないことを望んでいます。
ページが読み込まれたときに "return false" をシミュレートして、アンカー "jump" が発生するのを防ぐ方法はありませんか。
これが十分に明確であることを望みます。
感謝
どのように解決するのですか?
あなたの修正は動作しませんか?私は質問を正しく理解しているかどうかわからない - あなたは、デモページを持っていますか?あなたは試すことができます。
if (location.hash) {
setTimeout(function() {
window.scrollTo(0, 0);
}, 1);
}
編集:Windows上のFirefox、IE、Chromeでテストして動作しました。
編集2:移動
setTimeout()
内側
if
ブロックの中で、@vsyncをプロップスしています。
関連
-
[解決済み] jQueryでページを更新するにはどうすればよいですか?
-
[解決済み] jQueryでdata属性で要素を選択する
-
[解決済み] jQuery データ属性の値に基づいて要素を検索する方法は?
-
[解決済み] jQueryでtextareaの値を設定する
-
[解決済み] アンカーリンクをクリックしたときのスクロールを滑らかにする
-
[解決済み] jQueryの複数要素の同一クリックイベント
-
[解決済み] ドロップダウンのアイテムの選択値をjQueryで取得する
-
[解決済み] jQueryでval()がchange()をトリガーしない
-
[解決済み】jQueryのテンプレートエンジン【終了しました
-
[解決済み】jQuery:keyPress Backspaceが発射されない?
最新
-
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 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] jquery 3.0 url.indexOfエラー
-
[解決済み] JavaScript - 二重引用符のエスケープ
-
[解決済み] jQueryでPUT/DELETEリクエストを送信する方法は?
-
[解決済み] jQueryでオブジェクトに登録されたイベントハンドラを検索する
-
[解決済み] GoogleのCDNからjQuery UI CSSをダウンロードする
-
[解決済み] jQueryを使用して配列から特定の値を削除する方法
-
[解決済み] jQueryで、ある要素を他の要素に対して相対的に配置するには?
-
[解決済み] jQuery / JavaScriptでJSONデータをパースする方法は?
-
[解決済み】フォームのhiddenフィールドにjQueryの".val() "を使って値を設定してもうまくいかない。
-
[解決済み] jQueryで選択されたオプションのインデックスを取得する