10

ウィジェットの複数のカテゴリがあるサイトのセクションがあります。各カテゴリ名のメニューがあります。Javascriptが有効になっている場合は、カテゴリをクリックすると、ページ内のカテゴリのコンテンツが表示されます。必要に応じてDOMが更新されるのを確認しながら、カテゴリ間を自由にクリックできます。URLも、標準のハッシュ/ハッシュバンを使用して更新されます（Googleに対応している場合）。したがって、に着陸した人は、、などに移動example.com/widgetsできます。example.com/widgets#oneexample.com/widgets#twoexample.com/widgets#three

ただし、Javascriptが有効になっていないユーザーエージェントをサポートするには、これらのカテゴリリンクのいずれかをたどると、カテゴリが表示された新しいページを読み込む必要があるため、javascriptが有効になっていないユーザーの場合は、などに移動example.com/widgets/oneしますexample.com/widgets/two。example.com/widgets/three

私の質問は次のとおりです。Javascriptが有効になっている人がこれらのURLの1つにアクセスするとどうなりますか？たとえば、Javascriptが有効になっている人には、着陸時に何を提示する必要がありますか？それらをリダイレクトする必要がありますか？example.com/widgets/oneexample.com/widgets#one

Javascriptが有効になっている人には単一ページのサイトエクスペリエンスが必要ですが、JavaScriptを使用しないユーザーエージェントには複数ページのサイトが必要であることに注意してください。この事実に対処しない答えは、質問に答えません。私は、ハッシュバンやシングルページサイトとマルチページサイトのメリットや問題には興味がありません。

4

4 に答える 4

6

これは私がそれを構築する方法です：

HistoryJSを使用してURLを管理します。JSプッシュステートブラウザは完全に正しいURLを取得し、JS非プッシュステートブラウザはハッシュされたURLを取得しました。非JSユーザーは、ページのリロードで通常どおり完全なURLにアクセスしました。

ユーザーがリンクをクリックすると：

JSがある場合： 他のページへのすべてのクリックは、デフォルトのアクションを防止する関数によって処理され、HREFを取得して、URLをajaxリクエストに渡し、同時にURLを更新します。次に、そのajaxリクエストのhttp応答が解析され、コンテンツ領域にロードされます。

JS以外： ページは通常どおり更新され、ドキュメント全体が読み込まれます。

ページが読み込まれるとき：

JSの場合：デフォルトを防ぐためにすべてのリンクにイベントハンドラーをアタッチして、それらのhrefがAjaxを介して処理されるようにします。

JSなし：何もありません。アンカーが通常どおり機能するようにします。

完全で正しいURLを介してすべてのコンテンツにアクセスできるようにし、ajaxを介してロードしてから、コンテンツの取得元のアドレスを反映するようにURLを更新する必要があると思います。そうすれば、JSが実行されていないときは、何も変更する必要はありません。

それはあなたが意味することですか？

于 2013-03-03T16:40:54.113 に答える
2

どうやらあなたの質問にはすでに答えが含まれています。あなたは言う：

Javascriptを有効にしている人には、単一ページのサイトエクスペリエンスが必要です

そして尋ねる：

たとえば、Javascriptが有効になっている人には、着陸時に何を提示する必要がありexample.com/widgets/oneますか？それらをリダイレクトする必要がありexample.com/widgets#oneますか？

はい、リダイレクトする必要があります。要件（およびJavaScript機能とURLのハッシュフラグメントに関する情報がサーバー側で利用できないという事実）を考えると、他のオプションは表示されません。

要件を少し緩和することを受け入れることができれば、別の選択肢があります。ウェブがフレームセットで混雑していて、AltaVista（Googleはまだ出回っていませんでした！）検索を介して特定のフレームに到達したことを覚えていますか？ページがフレームとして表示されることになっていることを示すヘッダーと、ユーザーをフレームセットバージョンに移動するためのリンクが表示されるのが一般的でした。

同様のことを行うことができます。スクリプトが利用可能になったら、現在の場所にいることを検出しexample.com/widgets/one、シングルページバージョンへのリンクを追加します。これは理想的ではないことはわかっていますが、何もないよりはましであり、厄介なクライアント側のリダイレクトよりも優れている可能性があります。

于 2013-02-27T17:15:15.377 に答える
0

それらを別のページにリダイレクトする必要があるのはなぜですか。ユーザーは答えを探しているページに到着しました。JavaScriptを有効にしている場合でも、彼は答えを受け取ります。それは問題ではありません。ユーザーのクエリが実行されました。

しかし、ユーザーがexample.com/widgets#oneにアクセスするとどうなるでしょうか？その場合、example.com / widgets/oneへの自動リダイレクトを設定する必要があります。これは、イベントでJavaScriptが有効になっているかどうかを確認onloadし、適切なページにリダイレクトすることで実行できます。

于 2013-02-27T04:38:56.893 に答える
0

このようなページをデザインする1つの方法は、最初にjavascriptを使用せずにデザインすることです。

ページでアンカーを使用できるので、次のようになります。

example.com/widgets#one

IDが「1」の要素へのリンクになります

ページがjavascriptなしで機能したら、javascriptレイヤーを追加します。event.preventDefaultを使用して、リンクがたどられるのを防ぐことができます。

（https://developer.mozilla.org/fr/docs/DOM/event.preventDefault）、次に必要なjavascript機能を追加します。

于 2013-03-03T15:09:00.070 に答える