onclick et ondblclick sur même élément : le premier est appelé lors du double clic [Résolu]

skeud · 06/07/2011, 14h35

Bonjour, j'ai un td qui possède deux attribut:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onclick="alert('simple click');"

et

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

ondblclick="alert('double click');"

Je suis sous ie 7 (évidemment c'est ma boite qui choisis ce navigateur

pas moi) et l’évènement onclick est appelé lors du double clique.

Ma question: comment faire pour que seul l’évènement ondblclick soit appelé lors d'un double clic ?

Merci d'avance

RomainVALERI · 06/07/2011, 17h45

Une tempo sur l'effet du simple click ? ^^
Du genre :

HTML :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<button onclick="click_simple()" ondblclick="click_double()">

(en supposant un bouton par exemple mais ça n'a bien sûr pas d'importance pour le problème posé)

JS :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
var meche;// pour la métaphore... allumer/éteindre la mèche ^^
function click_simple() {
   if (!meche)// pour ne pas lancer la fonction en doublon/triplon/etc.
      meche = setTimeout(function() {
         alert("simple clic");
      }, 500);// une demi-seconde par exemple mais à ajuster probablement
   }
}
 
function click_double() {
   if (meche) clearTimeout(meche);// pschit.
   alert("double clic");
}

NoSmoking · 06/07/2011, 19h00

Bonjour,

Citation:

Envoyé par skeud

Je suis sous ie 7 (évidemment c'est ma boite qui choisis ce navigateur

pas moi) et l'evenement onclick est appelé lors du double clique.

ce le même problème sur TOUS les navigateurs.

Attention à l'effet pervers d'un dbclick qui n'est autre que 2 simples click, la fonction mise sur le simple click peut être appelé 2 fois, il convient donc de bloquer celle ci.

Je te propose une petite variante, le principe étant le même que celui d'écrit par RomainVALERI

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<!DOCTYPE html>
<html>
<head>
<title>[...]</title>
<script type="text/javascript">
var iTimer, bDouble;
function fctClick(){
  bDouble = false;
  iTimer = setTimeout( function(){
    if( !bDouble){
      alert( 'fctClik');
    }
  }, 250);
}
function fctDbClick(){
  bDouble = true;
  clearTimeout( iTimer);
  alert( 'fctDbClik');
}
</script>
</head>
<body>
<div style="border:1px solid black; width:200px; height:50px;"
  onclick = "fctClick();"
  ondblclick = "fctDbClick();">
  Test
</div>
</body>
</html>

Dernière petite remarque, ce n'est quand même pas très ergonomique que de mettre un onclick et ondbclick sur un même élément!

RomainVALERI · 06/07/2011, 20h09

Citation:

[variante proposée par NoSmoking]

Oui, je pense que techniquement il est plus souhaitable de ne gérer qu'un seul événement (ici le clic) j'aime bien l'amélioration proposée.

Citation:

Envoyé par NoSmoking

Dernière petite remarque, ce n'est quand même pas très ergonomique que de mettre un onclick et ondbclick sur un même élément!

Je n'y avais pas pensé spontanément mais je suis là aussi d'accord avec NoSmoking ^^

Il y a quelques contextes qui peuvent justifier (au moins partiellement) ce choix mais c'est rare... (sur mobile, vu le manque d'espace disponible peut-être ? et encore... le double clic tactile... je n'ai pas de smartphone mais rien que l'idée me glace d'effroi

)

skeud · 07/07/2011, 08h20

Merci pour vos réponses, mais finalement j'ai solutionné mon problème, en fait la problématique était la suivante:

J'avais une case de tableau qui devait se colorer en vert lors du clique (pour signaler une personne présente) et en rouge lorsque cette personne n'est pas présente.
Je voulais donc lors du clic: personne présente.
Lors du doubleclick:personne non présente.

En fait j'ai fait avec php, un flag qui varie suivant si la personne est présente ou non, donc juste un click qui changera une valeur dans la bdd

Je garde quand même vos réponses, on sait jamais, ça peut servir

Merci encore et désoler du dérangement, mais comme souvant, c'est en postant notre problème sur dvp qu'on trouve la solution par nous même

RomainVALERI · 07/07/2011, 09h39

Citation:

Envoyé par skeud

Merci encore et désoler du dérangement, mais comme souvant, c'est en postant notre problème sur dvp qu'on trouve la solution par nous même

Oui, ne t'inquiète pas, nous avons tous d'ores et déjà accepté de partager ce destin facétieux avec les curés, les psychanalystes et aujourd'hui même les "coaches"...

06/07/2011, 14h35	#1
skeud Membre éprouvé romain escudier Développeur informatique Inscription : juin 2011 Messages : 300 Détails du profil Informations personnelles : Nom : romain escudier Âge : 22 Localisation : France, Ille et Vilaine (Bretagne) Informations professionnelles : Activité : Développeur informatique Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : juin 2011 Messages : 300 Points : 471 Points : 471	onclick et ondblclick sur même élément : le premier est appelé lors du double clic Bonjour, j'ai un td qui possède deux attribut: Code : Sélectionner tout - Visualiser dans une fenêtre à part onclick="alert('simple click');" et Code : Sélectionner tout - Visualiser dans une fenêtre à part ondblclick="alert('double click');" Je suis sous ie 7 (évidemment c'est ma boite qui choisis ce navigateur pas moi) et l’évènement onclick est appelé lors du double clique. Ma question: comment faire pour que seul l’évènement ondblclick soit appelé lors d'un double clic ? Merci d'avance __________________ Pas de solution, pas de probleme Une réponse utile (ou +1) le pouce vert Une réponse à votre question
	00

07/07/2011, 08h20	#5
skeud Membre éprouvé romain escudier Développeur informatique Inscription : juin 2011 Messages : 300 Détails du profil Informations personnelles : Nom : romain escudier Âge : 22 Localisation : France, Ille et Vilaine (Bretagne) Informations professionnelles : Activité : Développeur informatique Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : juin 2011 Messages : 300 Points : 471 Points : 471	Merci pour vos réponses, mais finalement j'ai solutionné mon problème, en fait la problématique était la suivante: J'avais une case de tableau qui devait se colorer en vert lors du clique (pour signaler une personne présente) et en rouge lorsque cette personne n'est pas présente. Je voulais donc lors du clic: personne présente. Lors du doubleclick:personne non présente. En fait j'ai fait avec php, un flag qui varie suivant si la personne est présente ou non, donc juste un click qui changera une valeur dans la bdd Je garde quand même vos réponses, on sait jamais, ça peut servir Merci encore et désoler du dérangement, mais comme souvant, c'est en postant notre problème sur dvp qu'on trouve la solution par nous même __________________ Pas de solution, pas de probleme Une réponse utile (ou +1) le pouce vert Une réponse à votre question
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email