12

戻るボタンをクリックすると同じ位置に戻る機能を実装したいと考えています。http://www.jabong.com/men/clothing/mens-t-Shirts/が良い例です。ここで、下にスクロールして製品をヒットし、製品ページから戻るをクリックすると、その製品があるページの同じ位置に到達します.

ここに示す例では、位置を記憶するために URL に何も追加していません。また、pushstate や history.js も使用しません (ajax による読み込みではありません)。

これを行う方法についての洞察はありますか?

編集: 無限スクロールのページネーション (ピンタレストなど) を使用しており、下にスクロールしてもページが読み込まれ続けます。戻ると、クエリが再度実行され、ページがリロードされます。前に 4 ページ目にいた場合、戻った後、ページは 4 ページまでロードされないため、休憩があり、その位置に到達できません。

だから私の質問は、無限スクロールでこれを行うにはどうすればよいですか?

4

4 に答える 4

1

アプリケーションで JQuery を使用できる場合。非常に使いやすい WayPoint プラグインを試すことができます。あなたの質問から、それがあなたが探しているものだと思います。

無限スクロールとその機能の例を次に示します。

http://imakewebthings.com/jquery-waypoints/shortcuts/infinite-scroll/

また、他のさまざまなプラグインを使用した無限スクロールのチュートリアルもご覧ください。ニーズに最も適したプラグインを使用できます。

http://www.jquery4u.com/tutorials/jquery-infinite-scrolling-demos/

編集:

ユーザーが戻るボタンを使用して無限スクロールを中断した場所を復元しようとしている場合、これはもう少しトリッキーであり、データの生成方法とデータの生成方法についてさらに作業が必要になります。ここで同様の質問を見てください:

戻るボタンを処理できる「無限スクロール」JavaScript を作成することは可能ですか?

于 2013-07-04T17:58:34.143 に答える
0

私は同じ問題を抱えていましたが、状況はかなり似ていました.URLでブックマークやパラメータが変更されていません.

ここに私の解決策があり、それは機能します:

1)ブラウザの戻るボタンと同じwindow.history.go(-1)またはを使用して、前のページに移動できます。window.history.back()

2) この機能を使用すると、何らかの理由で前のページの位置に戻らない場合があります (例: ページの下部にある画像を選択すると、次のページにリダイレクトされます。[戻る] ボタンをクリックすると、前のページの先頭に戻ります)。この場合、アプリが次のページ (通常はまたはイベント)var currentScrollYonSession = window.scrollYにリダイレクトするときに、コードに応じて、セッションまたは他の場所で現在の scrollY 値を設定する必要があります。「戻る」ボタンをクリックしてアプリが前のページをロードする場合、まず scrollY 値が null であるかどうかをセッションで確認します。null の場合は、ページをそのままロードします。それ以外の場合は、scrollY 値を取得し、ページをロードして、scrollY 値を現在のページに設定します。onClick()onChange()window.scroll(0, currentScrollYonSession)

于 2015-02-17T06:27:25.517 に答える