2010-12-10 3 views
3

J'ai une table-ligne qui a une action Javascript attaché à clics de souris partout dans la ligne de la table:comment ignorer le premier événement et passer à la seconde?

<tr onmousedown="someAction(this)"> 
    <td>cell 1</td> 
    <td>cell 2</td> 
    <td><a href="page2.html">cell 3</a></td> 
</tr> 

Si un utilisateur clique sur ne importe où dans la ligne, je veux l'action Javascript, uneAction (this), être suivi. Cependant, si un utilisateur clique sur le lien vers la page2, alors je veux que l'action soit ignorée et le lien suivi.

Malheureusement, l'action est d'abord observée, ce qui arrive à déplacer la position du texte lié juste assez pour que le clic soit abandonné. En d'autres termes, l'utilisateur ne peut pas réellement cliquer sur le lien et aller à la page2, dans ce cas. Comment puis-je désactiver l'action mousedown pour les clics sur le lien?

Merci!

Mise à jour: Sur la base des réponses, j'ai finalement inclus le code JavaScript suivant à la fin du HTML, qui a enregistré un gestionnaire d'événements pour arrêter la propagation comme l'a suggéré, comme suit:

... 
<script type="text/javascript" language="javascript"> 
//<![CDATA[ 
function stopEvent(ev) { 
    ev.stopPropagation(); 
} 
var links = document.getElementsByTagName('a'); 
for (var i = 0; i < links.length; i++) { 
    links[i].addEventListener("onmousedown", stopEvent, false); 
} 
//]]> 
</html> 

Cela pourrait avoir a été facilement inclus dans l'événement onload du document, mais la section CDATA était déjà requise pour d'autres raisons, j'ai donc ajouté ce dont j'avais besoin ici.

Merci pour toute l'aide et bonnes suggestions! :)

Répondre

5

Si vous utilisez jQuery, il serait aussi simple que cela (supposons que vous avez défini et id = 'ligne' pour tr élément et id = 'link' pour un élément):

$('#row').click(someaction); 
$('#link').click(function(event){event.stopPropagation()}); 

Vous pouvez Sans regarder jQuery, c'est presque pareil, mais vous devez d'abord obtenir le handle de chaque élément, puis utiliser la méthode addEventListener pour attacher un écouteur d'événement (faire en sorte que le gestionnaire de ligne utilise bubbling au lieu de capturer par mettre le dernier paramètre à false), puis le même ancien event.stopPropagation().

Ce serait quelque chose comme ça (http://jsfiddle.net/VDQMm/2):

var row = document.getElementById('row'); 
var link = document.getElementById('link'); 
row.addEventListener('click',alert('clicked row!'),false) 
link.addEventListener('click',function(event){event.stopPropagation()},false) 
+0

Merci! Je n'utilise pas jQuery pour ce projet, j'ai donc utilisé du JavaScript, inclus dans le code HTML de fermeture, pour accomplir cette tâche (voir ma question éditée plus haut). – Trevor

+0

@Stephen, merci de le rendre plus clair – unclenorton

Questions connexes