Heim > Web-Frontend > js-Tutorial > Hauptteil

Wie kann ich unerwünschtes Scrollen der Seite beim Klicken auf JavaScript-Links verhindern?

Susan Sarandon
Freigeben: 2024-10-26 02:11:02
Original
172 Leute haben es durchsucht

How Can I Prevent Unwanted Page Scrolling When Clicking JavaScript Links?

Seitenscrollen bei Klicks auf JavaScript-Links verhindern

Wenn Ihre Webseite Links enthält, die JavaScript-Ereignisse auslösen, aber auch zu einer neuen Seite navigieren, sind Sie kann ein unerwünschter Nebeneffekt auftreten: Die Seite scrollt nach oben. Dieses Verhalten kann den Benutzerfluss unterbrechen und die beabsichtigte Funktionalität Ihrer Website beeinträchtigen.

Um dieses Scrollverhalten zu verhindern, müssen Sie die mit dem Linkklick verbundene Standardaktion deaktivieren, die zur Ziel-URL weiterleitet. Hier sind zwei effektive Methoden, um dies zu erreichen:

Option 1: event.preventDefault()

Mit dieser Methode können Sie die Standardaktion explizit verhindern, indem Sie .preventDefault aufrufen ()-Methode des Ereignisobjekts, das an Ihren Ereignishandler übergeben wird.

  • jQuery:

    <code class="js">$('#ma_link').click(function($e) {
      $e.preventDefault();
      doSomething();
    });</code>
    Nach dem Login kopieren
  • addEventListener (raw DOM):

    <code class="js">document.getElementById('#ma_link').addEventListener('click', function (e) {
      e.preventDefault();
      doSomething();
    })</code>
    Nach dem Login kopieren

Option 2: false zurückgeben;

In jQuery wird false von einem zurückgegeben Der Ereignishandler ruft automatisch die Methoden .stopPropagation() und .preventDefault() auf. Dies bietet eine alternative Möglichkeit, das standardmäßige Linkverhalten zu verhindern:

<code class="js">$('#ma_link').click(function(e) {
     doSomething();
     return false;
});</code>
Nach dem Login kopieren

Wenn Sie rohe DOM-Ereignisse (nicht jQuery) verwenden, funktioniert die Rückgabe von „false“ auch in modernen Browsern, aber für maximale Kompatibilität mit älteren Browsern, Es wird empfohlen, .preventDefault().

explizit aufzurufen

Das obige ist der detaillierte Inhalt vonWie kann ich unerwünschtes Scrollen der Seite beim Klicken auf JavaScript-Links verhindern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage