Comment empêcher le défilement de la page vers le haut lorsque vous cliquez sur des liens JavaScript ?

Empêcher le défilement de la page vers le haut lorsque vous cliquez sur des liens déclenchés par JavaScript

Lorsque vous cliquez sur un lien associé à un événement JavaScript, tel que :

<a href="#">My Link</a>

la page peut défiler vers le haut involontairement. Pour éviter ce comportement tout en conservant la fonctionnalité du lien, envisagez les solutions suivantes :

Option 1 : event.preventDefault()

Utiliser la méthode .preventDefault() de l'objet événement pour empêcher le navigateur d'effectuer son action par défaut de navigation vers le lien.

<code class="javascript">$('#ma_link').click(function($e) {
    $e.preventDefault();
    doSomething();
});

document.getElementById('#ma_link').addEventListener('click', function (e) {
    e.preventDefault();
    doSomething();
})</code>

Option 2 : return false ;

Dans jQuery, renvoyer false à partir d'un événement Le gestionnaire appelle automatiquement event.stopPropagation() et event.preventDefault().

<code class="javascript">$('#ma_link').click(function(e) {
     doSomething();
     return false;
});</code>

Pour plus de compatibilité avec les navigateurs, appelez explicitement .preventDefault() lors de l'utilisation d'événements DOM bruts.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!