Heim >Web-Frontend >js-Tutorial >Wie kann ich erkennen, wenn ein Benutzer zum Ende einer Webseite gescrollt hat?

Wie kann ich erkennen, wenn ein Benutzer zum Ende einer Webseite gescrollt hat?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-11-17 20:47:02495Durchsuche

How Can I Detect When a User Has Scrolled to the Bottom of a Webpage?

Identifizieren der Scrollposition des Benutzers auf einer Webseite

Die Feststellung, ob ein Benutzer zum Ende einer Webseite gescrollt hat, ist für die Ausführung bestimmter Aktionen von entscheidender Bedeutung , wie zum Beispiel die automatische Aktualisierung der Seite. So können Sie diese Erkennung erreichen:

Zunächst müssen Sie einen Scroll-Ereignis-Listener für das Fensterobjekt registrieren:

window.onscroll = function(ev) {

Innerhalb dieses Event-Handlers können Sie den aktuellen Scroll berechnen positionieren und mit der Höhe der Webseite vergleichen:

if ((window.innerHeight + Math.round(window.scrollY)) >= document.body.offsetHeight) {
  • window.innerHeight: Stellt die sichtbare Höhe des Browserfensters dar.
  • window.scrollY: Gibt den vertikalen Bildlauf an Position innerhalb der Webseite.
  • document.body.offsetHeight: Gibt die Gesamthöhe des Webseiteninhalts an, einschließlich gescrollter und nicht gescrollter Bereiche.

Wenn die Summe von window.innerHeight und window.scrollY größer oder gleich document.body.offsetHeight ist, bedeutet dies, dass der Benutzer das Ende der Seite erreicht hat und die Aktionen auslöst, die Sie ausführen müssen.

Beispielimplementierung

Um beispielsweise die Webseite mit neuen Inhalten zu aktualisieren, sobald sie unten angekommen ist, könnten Sie den folgenden Code verwenden:

window.onscroll = function(ev) {
    if ((window.innerHeight + Math.round(window.scrollY)) >= document.body.offsetHeight) {
        // Load or generate new content to add to the bottom of the page
    }
};

Mit dieser Technik können Sie effektiv feststellen, ob ein Benutzer zum Ende einer Seite gescrollt hat und entsprechende Aktionen entsprechend ausführt.

Das obige ist der detaillierte Inhalt vonWie kann ich erkennen, wenn ein Benutzer zum Ende einer Webseite gescrollt hat?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn