3

URL ハッシュに基づいてページに異なるコンテンツを表示するにはどうすればよいでしょうか?

アンカーされたセクションを表示するためにブラウザーが下にスクロールすることについて話しているのではなく、そのハッシュに反応し、AJAX を介してさまざまなコンテンツをロードする JavaScript のようなものです。

これは一般的ですか、それとも可能性がありますか?

4

7 に答える 7

2

これは時々行われます。YouTube はハッシュを使用して、動画内の特定のタイムスタンプにリンクします。

編集：ユーザーがアドレスバーのハッシュを手動で編集すると、ページがリロードされず、JavaScriptでさえ変更されたことを認識できないという問題があると想定していました。私は間違っていた。Youtubeで試してみましたが、うまくいきました。

于 2009-06-02T17:55:59.400 に答える
2

そうそう、コンテンツが AJAX 駆動の場合、ページ状態から URL への永続性を処理するのが一般的なパターンになりつつあります。

Javascript は、window.location.hash を介してこの値にアクセスできます。それが完了したら、そのハッシュの値に基づいて任意のアクションを実行できます

  • ノードの表示/非表示
  • 他の AJAX 呼び出しを行います
  • ページのタイトルや色を変更する
  • 画像を入れ替える
  • 等

本当に、すべての DHTML 効果。

于 2009-06-02T17:57:12.220 に答える
2

数週間前にこれを行うためのシステムを構築したばかりです

ブラウザによっては、ハッシュを検出する必要があります。その方法は次のとおりです。

// test all possible places hash could be on different browsers
if(window.location.hash){
   hash = window.location.hash;
} else if (document.location.hash){
   hash = document.location.hash;
} else if (location.hash){
   hash = location.hash;
}

// some browsers start the hash with #, remove it for consistency
if(hash.substring(0,1) == '#'){
    hash = hash.substring(1,hash.length);
}

次に、ハッシュ変数の値を処理して、必要に応じてページ変更をトリガーします。

例: http://www.example.com#pageA

if(hash = 'pageA'){
  document.getElementById('mainContentDiv').innerHTML = '<p> content for the page displayed when the hash sais pageA</p>';
}
于 2009-06-02T17:57:32.483 に答える
2

Sammyは、まさにこれを行う JavaScript ライブラリです。

于 2009-06-03T00:15:34.357 に答える
1

この質問に対する答えは、これらの質問に対する私の答えとほぼ同じになります。

要約すると、ハッシュ変更プロセス全体を説明し、それをajaxで使用する、おそらく見たいと思う2つのプロジェクトは次のとおりです。

  • jQuery履歴（ハッシュを使用してページの状態を管理し、変更にバインドしてページを更新します）。

  • jQuery Ajaxy（jQuery Historyのajax拡張機能。完全に目立たず、優雅に分解可能でありながら、完全なajax Webサイトを可能にします）。

于 2010-08-28T17:02:52.440 に答える
1

JavaScript は URL 文字列にアクセスできるため、もちろん URL のコンテンツに対して異なる動作をする可能性があります。

私は時々このようなものを見てきましたが、非常に特殊な用途でない限り、これは良い反応方法だとは思いません.

私が覚えている用途の 1 つは、TiddlyWikiでハッシュの after 部分を使用して、ページのレンダリングなどの設定を行うことでした。

于 2009-06-02T17:56:00.833 に答える
1

AJAX を多用するアプリケーション (Gmail を考えてください) では、特定のページをブックマークしたり、誰かを特定のページにリンクしたりしながら、すべての AJAXy を利用できることはかなり一般的です。これを行わないと、ユーザビリティが悪いと見なされます。URL ハッシュを取得するのは非常に簡単window.location.hashです。そのため、ハッシュが存在する場合は、ページの読み込み時にスイッチのようなステートメントを使用して、特定の Javascript 関数のセットを実行できます。

この機能を実現するいくつかの jQuery プラグイン: history/remote、history。

于 2009-06-02T17:56:54.793 に答える