[POO] Champ password en clair

Bonjour,

Je voudrais qu'en cochant la case le mot de passe apparaisse en clair, mais rien n'y fait, merci de bien vouloir m'aider...

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<script type="text/javascript"> function pass() { var mon_element = document.getElementById("element_cache"); mon_element.setAttribute("type", "text"); } </script>   <form name="mon_form"> <input type="password" id="element_cache" name="mon_ele" /> <input type="checkbox" name="caset" onclick="pass()" />Mot de passe en clair<br /> <button>Cliquez ici pour vérifier le formulaire</button> </form>

---

Merci d'avance

bonjour,

Code:

---

1 2	var mon_element = document.getElementById("element_cache"); mon_element.type = "text";

---

mais ça ne marchera pas sous IE, donc le mieux est d'utiliser deux éléments : un élément password et un élément text :
l'élément text sera caché tant que tu n'auras pas cliqué dans la case. Lors du clic sur la case, tu affiches l'élément text et cache l'élément password et tu transferts le contenu du password vers le text.

Code:

---

1 2 3 4 5 6 7 8 9 10 11

function pass() { var mon_element = document.getElementById("element_cache"); var mon_autre_element = document.getElementById("element_clair");     mon_autre_element.value = mon_element.value; mon_element.style.display = "none"; mon_autre_element.style.display = ""; }

---

puis le code HTML :

Code:

---

1 2 3 4 5 6 7 8

<form name="mon_form"> <input type="password" id="element_cache" name="mon_ele" /> <input type="text" id="element_clair" name="mon_ele" style="display:none" />   <input type="checkbox" name="caset" onclick="pass()" />Mot de passe en clair<br /> <button>Cliquez ici pour vérifier le formulaire</button> </form>

---

Merci beaucoup pour ta réponse :)
Petite question, pourquoi on ne peut pas modifier la valeur de l'attribut type comme je l'avais proposé ???

Merci pour ton aide :king:

hum je ne sais pas trop.... peut-être que cela équivaut à transformer un objet d'un type en un autre type : c'est comme si tu transformais un <div> en <p>.