[Ok] events et onclick

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
arno.
Varan
Messages : 1347
Inscription : 19 août 2004, 12:26

[Ok] events et onclick

Message par arno. »

Bonjour, j'ai le code suivant :

Code : Tout sélectionner

<body>
<script type="text/javascript">
function clique(e) {
    alert(e.target.getAttribute("value"));
    e.stopPropagation();
}
</script>

<div value="1" 
    style="background-color:blue; height:400px; width:400px">
    <div value="2" 
    style="background-color:red; position:absolute; left:100px; top:100px; height:200px; width:200px"
    onclick="clique(event)">
        <div value="3" 
        style="background-color:green; position:absolute; left:50px; top:50px; height:100px; width:100px">
        </div>
    </div>
</div>

</body>
que vous pouvez aussi voir en vrai ici :
http://ffsearchplugins.free.fr/divers/events.html

Ce que j'aimerais bien, ce que quand je clique sur le carrè rouge, je puisse récupérer sa valeur associée ("2"). Malheureusement, quand je clique sur le carré vert, qui est « devant » le bleu, il me retourne la valeur du carré vert. Alors que je n'ai pas mis d'attribut "onclick" sur cet élément. Quelqu'un a une idée de comment je pourrais faire ?

merci.
Dernière modification par arno. le 26 mai 2006, 19:09, modifié 1 fois.
SB
Varan
Messages : 1095
Inscription : 05 mars 2004, 18:38

Message par SB »

Peut être en plaçant value et onclick sur une map que tu mettrais au premier plan en position identique au carré rouge.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.3) Gecko/20060426 Firefox/1.5.0.3
martin
Varan
Messages : 1074
Inscription : 21 janv. 2004, 16:23

Message par martin »

Code : Tout sélectionner

function clique(e) {
    if (e.currentTarget == e.target) alert(e.target.getAttribute("value"));
    e.stopPropagation();
}
ne marche pas dans IE (qui ne passe de toute façon pas l'event en argument à la fonction), mais y'aurait surement moyen.

un chouette lien sur des explications sur les events, les problèmes cross-browsers, et des solutions :
http://www.quirksmode.org/js/events_order.html
et plus généralement : http://www.quirksmode.org/ , section Events.
arno.
Varan
Messages : 1347
Inscription : 19 août 2004, 12:26

Message par arno. »

merci à vous deux. Je ne connaissais pas currentTarget, ça résoud pas mal de pbs. merci aussi pour le lien.
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 2 invités