2012-04-18 13 views
1

無限スクロールや「結果をもっと読み込む」ボタンを使用して検索結果を実装すると、初期結果ページにさらに多くの結果が表示されます。したがって、ユーザーは同じ検索結果ページを離れることなく結果を移動することができます。ユーザーが戻るボタンをクリックしたときにクライアントが変更したページを再構築するにはどうすればよいですか?

ユーザーがしばらくスクロールしてから、特定の結果を見つけてクリックします。彼らが必要とするものではないので、彼らはクリックします。

結果ページを残した状態で戻し、ページを正しい位置にスクロールさせて完了させるにはどうすればよいですか?最初の検索では、20個以上を読み込んだ場合は10個、ページには30個の結果が表示され、ページを出ると23個の結果が表示されます。

これを行うには、どのような方法がありますか?

(これは検索結果に固有のものではないことに注意してください)一般に、ブラウザに読み込まれた後にページを混乱させると、ユーザーが戻ったときにこのページの状態を保持/ )

答えて

-1

1つの方法は、ブラウザをプログラムによってシミュレートすることです。 JavaScriptの履歴オブジェクトを使用してください。次のようにボタンを押してgo()関数をクリックすると、

history.go(-1) 

これは単に前のページに移動します。

See here詳細については、

+0

これは、ユーザーが「戻る」ボタンを押したときに役立ちません。さらに、ページは依然として「リセット」されます。クライアント側のスクリプトは実行されません。 – Deane

+0

このオプションを試しましたか?私はGoogleの結果ページでこれをテストしました。私は100の結果を表示するように設定しました。私は最後の結果をクリックして、この関数を使うと同じスクロール位置に戻ることができ、ページはリセットされません。 – Santosh

0

この問題には複数のアプローチがあります。

  • 検索結果を処理しているとします。より多くの結果を表示するたびに、次の検索結果の開始インデックスが上昇します。

    10個の要素の第三ロードした後は、インデックスが40

    今、あなたは例えばhttp://mysite.com/search?q=searchterm#startindex=40にそれを拡張、ハッシュとしてURLに動的にこのインデックスを置くことができるだろう開始しています。ユーザーが検索結果をクリックしてから戻ると、その値をURLから抽出して、適切な量の追加結果を表示することができます。
    オプションで、ユーザーを多かれ少なかれ彼の最後の位置にスクロールします。

    この原則は、クッキー、localStorage、セッションパラメータ、またはURLハッシュではなく、何を使用するかによってアナログで動作します。

  • クライアント側で完全な検索結果をlocalStorageのような場所に保存して(「戻る」ボタンの後に)そこから読み取ってページに挿入することができます。このようにして、サーバーから再度要求する必要はなく、反応性が向上する可能性があります。

    この時点で、ユーザーのスクロール位置を保存して復元して、彼がページ上のどこに戻ってきたかを確認することもできます。

私は現在、同様の問題に取り組んでおり、アプローチ2を使用していると思います。