Ich möchte eine Funktionalität implementieren, bei der ich beim Klicken auf die Zurück-Schaltfläche zur selben Position zurückkehre. Ein gutes Beispiel könnte Ссылка sein. Wenn Sie hier nach unten blättern und ein Produkt ankreuzen und von der Produktseite zurückklicken, erreichen Sie dieselbe Position auf der Seite, auf der sich das Produkt befindet.
Das hier gezeigte Beispiel hängt nichts an die URL an, um sich an die Position zu erinnern. Es verwendet auch nicht den Befehl "pressstate" oder "history.js" (wird nicht über AJax geladen).
Irgendwelche Einblicke, wie ich das machen kann?
BEARBEITEN: Ich benutze unendlich scrollende Paginierung (wie pinterest), und die Seiten laden weiter nach unten scrollen. Wenn ich zurück gehe, wird die Abfrage erneut ausgeführt und lädt die Seite neu. Wenn ich auf der 4. Seite war, nachdem ich zurück gegangen bin, werden die Seiten erst auf Seite 4 geladen und es gibt eine Pause, also kann ich diese Position nicht erreichen.
Also meine Frage ist, wie mache ich das mit endlosem Scrollen?
Wenn Sie JQuery in Ihrer Anwendung verwenden können. Sie können versuchen Wegpunkt-Plugin es ist sehr einfach zu bedienen und von Ihrer Frage, ich denke, das ist, was Sie suchen.
>Hier ist ein Beispiel für Unendlich Scrolling und wie es funktioniert:
Sehen Sie sich auch diese Tutorials an, um unendliches Scrollen mit verschiedenen anderen Plugins zu ermöglichen, die Sie je nach Ihren Bedürfnissen verwenden können.
BEARBEITEN:
Wenn Sie mit der Zurück-Taste den Standort wiederherstellen möchten, an dem der Benutzer mit dem Endlos-Scroll-Vorgang fortgefahren ist, ist dies ein wenig komplizierter und erfordert mehr Arbeit von Ihrem Teil und wie Ihre Daten generiert werden. Bitte werfen Sie einen Blick auf eine ähnliche Frage hier:
Ich habe das gleiche Problem und die Situation war ziemlich ähnlich: Kein Lesezeichen oder Parameter in der URL geändert.
Hier ist meine Lösung und es funktioniert:
1) Sie können window.history.go(-1) oder window.history.back() verwenden, was der Zurück-Schaltfläche im Browser entspricht, um zur vorherigen Seite zu navigieren.
2) Wenn Sie diese Funktion verwenden, ist sie aus bestimmten Gründen nicht auf der letzten Seite (z. B. ein Bild am unteren Rand der Seite und es wird auf die nächste Seite weitergeleitet. Wenn Sie auf "zurück 'Taste, es geht zurück zum Anfang der vorherigen Seite). In diesem Fall müssen Sie abhängig von Ihrem Code den aktuellen Wert für scrollY var currentScrollYonSession = window.scrollY für die Sitzung oder einen anderen Ort festlegen, wenn die App zur nächsten Seite umleitet (normalerweise ist dies onClick() oder onChange() event). Wenn Sie auf die Schaltfläche "Zurück" klicken und die vorherige Seite von der App geladen wird, überprüfen Sie zunächst die Sitzung, dass der Wert scrollY null ist oder nicht. Wenn es null ist, lade einfach die Seite so wie sie ist; Andernfalls rufen Sie den scrollY-Wert ab, laden Sie die Seite und setzen Sie den scrollY-Wert auf die aktuelle Seite: window.scroll(0, currentScrollYonSession) .
Ich habe eine Lösung für meine App gefunden, um das zu erreichen:
%Vor%Dies verwendet LocalStorage, um zu speichern, wie viele Pixel wir vom oberen Rand der Seite entfernt haben.
%Vor%Die anfängliche Seitenladung enthält 30 Fotos mit Klassenfeldern. Meine Seitennummerierung beginnt mit einem Klick auf ein btn mit der Klasse photosbtn.
Tags und Links javascript html http