web-dev-qa-db-fra.com

Comment puis-je créer une ancre HTML vide pour que la page ne "saute" pas lorsque je clique dessus?

Je travaille sur certains JQuery pour masquer/afficher du contenu lorsque je clique sur un lien. Je peux créer quelque chose comme:

<a href="#" onclick="jquery_stuff" />

Mais si je clique sur ce lien pendant que je fais défiler une page, il remontera en haut de la page.

Si je fais quelque chose comme:

<a href="" onclick="jquery_stuff" />

La page se rechargera, ce qui débarrassera la page de toutes les modifications apportées par javascript.

Quelque chose comme ça:

<a onclick="jquery_stuff" />

Me donnera l'effet souhaité, mais il n'apparaît plus comme un lien. Existe-t-il un moyen de spécifier une ancre vide afin que je puisse affecter un gestionnaire javascript à l'événement onclick, sans rien changer sur la page ni déplacer la barre de défilement?

61
Alex Fort

Mettez un "retour faux;" sur la deuxième option:

<a href="" onclick="jquery_stuff; return false;" />
79
Otávio Décio

Tu dois return false; après le jquery_stuff:

<a href="no-javascript.html" onclick="jquery_stuff(); return false;" />

Cela annulera l'action par défaut.

24
Greg

Vous pouvez mettre simplement comme comme ci-dessous:

<a href="javascript:;" onclick="jquery_stuff">
23

jQuery a une fonction intégrée pour cela appelée preventDefault qui peut être trouvée ici: http://api.jquery.com/event.preventDefault/

Voici leur exemple:

<script>
$("a").click(function(event) {
    event.preventDefault();
});
</script>

Vous pouvez également créer le lien comme ceci:

<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>
19
nates

Vérifiez le commentaire de la paupière (utilisez un bouton, pas une ancre). Était sur le point de publier le même conseil. Une ancre qui ne lie pas à une ressource et qui exécute simplement un script doit être implémentée comme un bouton.

Arrêtez de mettre vos gestionnaires d'événements en HTML et arrêtez d'utiliser des balises d'ancrage qui ne servent pas à des fins sémantiques d'ancrage. Utilisez un bouton et ajoutez le gestionnaire de clics dans votre Javascript. Exemple: HTML <button id="jquery_stuff">Label</button> Et JavaScript $('#jquery_stuff').click(jquery_stuff);. Vous pouvez utiliser CSS pour styliser le bouton pour qu'il ressemble à un lien, en supprimant le remplissage, les bordures, la marge et la couleur d'arrière-plan, puis en ajoutant vos styles de lien (par exemple, la couleur et la décoration du texte). - sans paupières 19 octobre 10 à 17:40

6
Chris
<a href="javascript:;" onclick="jquery">link</a>

href requiert quelque chose si vous ne voulez pas que des erreurs apparaissent dans les validateurs html. Le javascript:; est un bon emplacement.

Si vous voulez vraiment utiliser le #:

<a href="#me" name="me" onclick="jquery">link</a>

Soyez prudent avec le return false;, il arrête les comportements par défaut de tout ce que vous faites.

De plus, si votre js est comme une soumission, vous pouvez rencontrer des problèmes dans Internet Explorer.

4
Dean
<a href="javascript:// some helpful comment " onclick="jquery_stuff" />