2010-11-02 5 views
0

J'ai une étiquette href avec une image imbriquée à l'intérieur et je veux pouvoir arrêter la page en sautant vers le haut après qu'elle est cliqué.Comment arrêter un lien de changer la position sur la page (maintenir la position de défilement arrière)

REMARQUE:

href ne publie pas de retour, il déclenche un événement jQuery sur la page.

<a href="#" onclick="javascript:SendPlaylist()" style="border:none;" class="addButton" ><img style="border:none;" src="/Images/icons/icon_add.gif"/></a> 

D'accord toute aide très appréciée.

Cheers, Pete

Répondre

3

Pourquoi ne pas simplement enlever l'ancre et ajouter l'événement onclick à l'image

comme ceci:

<img style="border:none;cursor:pointer;" src="/Images/icons/icon_add.gif" onclick="javascript:SendPlaylist()"/> 
+2

+1 mais vous devez aussi ajouter du CSS ('cursor: pointer 'sur le img par exemple :)) – Shikiryu

1

href = "#" l'amène à sauter en haut, donc logiquement parlant, afin d'éviter ce type de comportement, vous devriez remplacer la balise «a» par un span ou quelque chose de similaire. L'onclick devrait toujours fonctionner et à moins que SendPlaylist ne saute en haut, il ne devrait pas changer votre position de défilement.

0

La raison pour laquelle le navigateur se déplace vers le haut, c'est qu'il tente de trouver l'ancre nommée "#".

Vous pouvez supprimer complètement l'étiquette de lien. Le gestionnaire onclick de n'importe quel élément devrait être suffisant pour vos besoins.

2

Cela devrait fonctionner:

$(".addButton").click(function(event) { 
    // Do your stuff here 
    event.preventDefault(); 
}); 

Hope this helps!

1

Saut entre les liens sur une page en utilisant des ancres et plus ou moins rester avec le lien en question voir anyword2

<html> 
<body> 

<a href="#top">top</a> 

<a href="#anylink">Jump to anylink</a> 

<a name="anylink">TEXT</a> 


<p> Top 

<a href="#anylink2">Jump to anylink2</a> 


<br><br><br><br><br> 
<br><br><br><br><br> 

<p> bottom 



<a href="#bottom">Jump to Bottom</a> 


<br><br><br><br><br><br><br><br> 

<a href="#anylink2">Stay at link2</a> 
<a name="anylink2">anylink 2 </a> 
<a href="#bottom">Jump to Bottom</a> 


<br><br><br><br><br<br><br<br><br 

<br><br><br><br><br<br><br<br><br<br<br><br 

<a name="bottom">You're at the bottom!</A> 

<a href="#top">Jump to top</a> 

</body> 
</html> 
+0

L'OP essaye d'empêcher cela de se produire, pas de le faire arriver. –

1

la solution logique serait ici:

<a href="#" onclick="SendPlaylist(); return false;" style="border:none;" class="addButton" ><img style="border:none;" src="/Images/icons/icon_add" onclick="javascript:SendPlaylist()"/></a> 

vous n'utilisez pas le "javascript" mot-clé en utilisant onclick ... vous pouvez l'utiliser dans le HREF lui-même, ce qui produirait:

<a href="javascript:SendPlaylist(); return false;"> 

... et vous pouvez ensuite supprimer complètement la pièce onclick.

je aussi ne vois pas une raison pour une autre onclick pour cette balise img bien - il peut supprimer purement et simplement, car il serait probablement dupliquer l'appel de ce lien

aussi, puisque vous dites que le lien ne publie pas mais utilise un événement jQuery, peut-être ajouter un "return false" à cet événement fonctionnerait aussi bien que renvoyer false dans le onclick

Questions connexes