Comment puis-je créer une ancre HTML vide pour que la page n'a pas « sauter » quand je clique dessus?

Question

Je travaille sur certains JQuery pour masquer / afficher un 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 alors que je suis sur une défile page, il revenir en arrière en haut de la page.

Si je fais quelque chose comme:

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

La page se rechargera, la page qui débarrasse de toutes les modifications que le javascript a fait.

Quelque chose comme ceci:

<a onclick="jquery_stuff" />

me donner l'effet désiré, mais il ne se présente comme un lien. Est-il possible de spécifier une ancre vide afin que je puisse attribuer un gestionnaire javascript à l'événement onclick, sans changer quoi que ce soit sur la page ou le déplacement de la barre de défilement?

Answer 1

Mettez un "return false;" sur la deuxième option:

<a href="" onclick="jquery_stuff; return false;" />

Answer 2

Vous devez après la return false; jquery_stuff:

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

Ceci annulera l'action par défaut.

Answer 3

Vous pouvez mettre simplement comme ci-dessous:

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

Answer 4

jQuery a une fonction intégrée dans cette appelé qui peut être preventDefault trouvé 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>

Answer 5

Vérifier eyelidlessness' commentaire (utilisez un bouton, pas un point d'ancrage). Était sur le point de poster les mêmes conseils. Une ancre qui ne lie pas à une ressource et exécute simplement devrait être mis en place un script comme un bouton.

  

Arrêtez de mettre vos gestionnaires d'événements en HTML, et cesser d'utiliser les balises d'ancrage   qui ne servent pas d'ancrage des fins sémantiques. Utilisez un bouton et ajoutez la   cliquez sur Gestionnaire dans votre Javascript. Exemple: HTML et JavaScript <button id="jquery_stuff">Label</button>   $('#jquery_stuff').click(jquery_stuff);. Vous pouvez utiliser le style CSS pour la   bouton pour ressembler à un lien, en supprimant le rembourrage, les frontières, la marge et   background-color, puis en ajoutant vos styles de lien (par exemple. couleur et   text-decoration). - eyelidlessness 19 octobre '10 à 17h40

Answer 6

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

href il faut quelque chose là-dedans si vous voulez ne pas pop-up des erreurs dans validateurs HTML. Le est un bon javascript:; place holder.

Si vous voulez vraiment utiliser le #:

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

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

Aussi, si votre js est comme un vous soumettre pouvez rencontrer des problèmes dans Internet Explorer.

Answer 7

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

Answer 8

J'utilise habituellement un et le style <span> pour ressembler à un lien quand je dois accomplir quelque chose comme ça.

Answer 9

  <a href="#" class="falseLinks">Link1</a>
  <a href="#" class="falseLinks">Link2</a>

etc ..

JQUERY:

  $(function() {
    $("a.falseLinks").click(function() {
      // ...other stuff you want to do when links is clicked

      // This is the same as putting onclick="return false;" in HTML
     return false;
    })
  });

@eyelidlessness était un peu douchy dans la façon dont il a dit, mais il avait raison. C'est la plus propre façon de le faire. Pourquoi utiliser jQuery si vous allez alors va revenir à la vanille Javascript pour des trucs jQuery ne facile et plus propre?

Answer 10

En général, je fais:

<a style="cursor:pointer;" onclick="whatever();">Whatever</a>

Answer 11

Que diriez-vous ceci:

<a href="#nogo" onclick="foo();">some text</a>