Discussion :

[flo57570]

Bonjour à tous,

Voici mon code :

Code :

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

1
2
3
4
5
6
 
<img src="Accessoires/tabouret.JPG" height="100px" width="150px" border="1" style="border-color:black" onclick="document.getElementById('tabouret').checked = true">
 
<input type="checkbox" name="tabouret" id="tabouret"/> 
 
<label for="tabouret">Tabouret</label>

J'ai une checkBox en dessous de mon image, je voudrais qu'elle puisse se cocher en cliquant sur l'image !!

Pour le moment ca marche très bien lorsque la checkBox est vide.

Mon problème est que lorsque ma checkBox est déjà cocher je n'arrive pas a trouver le code qui me permet de la décoché en cliquant sur l'image !! Avez-vous une solution ??


une grand merci d'avance


Flo

[RomainVALERI]

Tu peux faire quelque chose comme ça :

Code javascript :

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

1
2
3
4
function cocher(elem) {
   if (elem.checked == "checked") elem.removeAttribute("checked");
   else elem.checked = "checked";
}

avec une définition un peu différente pour ton élément HTML :

Code html :

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

<img src="Accessoires/tabouret.JPG" height="100px" width="150px" border="1" style="border-color:black" onclick="cocher(this);">

[Watilin]

C'est parce que le DOM des checkboxes est un peu tordu : si la checkbox est cochée, elle a un attribut checked dont la seule valeur possible est "checked", et si elle est décochée, cet attribut est retiré.

Code HTML :

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

<input type="checkbox" checked="checked" />

Code HTML :

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

<input type="checkbox" />

Comme le suggère Romain, il faut utiliser removeAttribute.

[andry.aime]

Bonsoir,

C'est parce que le DOM des checkboxes est un peu tordu : si la checkbox est cochée, elle a un attribut checked dont la seule valeur possible est "checked", et si elle est décochée, cet attribut est retiré.

en javascript, on utilise un booléen pour l'état d'un checkbox

Code :

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

1
2
document.getElementById("idCheckbox")=true;//le cocher
document.getElementById("idCheckbox")=false;//le décocher

A+.

[Watilin]

Euh… :$

Yep, je ne sais pas où étaient mes neurones hier soir. Le DOM et l'attribut sont bien différenciés dans la spécification (http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-30233917).

Code JS :

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

1
2
3
4
// pour cocher
document.getElementById("idCheckbox").checked = true;
// pour décocher
document.getElementById("idCheckbox").checked = false;

Merci Andy et Romain ^^