Bonjour,
J'ai une page dans laquelle il y a un titre "appuyez la"
Je veux que javascript detecte chaque click de souris sur le titre et rajoute par la suite un label, un champ input et un lien sur la meme ligne.
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 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> <head> <title>TD : verifier les champs</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script type="text/javascript" src="j.js"></script> </head> <body> <div id="identifiant1"> <h1 onclick="javascript:verifier();">appuyez là</h1> <fieldset id="champs"> <form id="identifiant" action="page.php" onsubmit="return verifier(document.getElementById('monForm'));"> </form> </fieldset> </div> </body> </html>
Le probleme est qu'un click sur un lien (sous googleChrome) fait que tous les liens et les champs disparaissent sauf le titre initial. Sous FF la suppression ne marche pas carrement et sous IE meme la creation des liens ne marche pas.
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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51 function verifier() { var corps = document.getElementById("identifiant"); var champCree = document.createElement("input"); //creer un champ de saisie nommé "champCree" var saut = document.createElement("br"); // saut est le retour à la ligne var label = document.createElement("label"); // label est la balise </label> var lien = document.createElement("a"); // creer un lien de suppression de champs var texteLien = document.createTextNode("supprimer"); lien.appendChild(texteLien); lien.setAttribute("href","#"); if(document.all) { lien.attachEvent("onclick",supprimer); } else { lien.addEventListener("click",supprimer,true); } champCree.setAttribute("class","monChamp"); var tableauChamp = document.getElementsByClassName("monChamp"); var nbreChamp = tableauChamp.length; if((nbreChamp+1)<10) { var textLabel = document.createTextNode("valeuur"+(nbreChamp+1) ); } else { var textLabel = document.createTextNode("valeur"+(nbreChamp+1) ); } label.appendChild(textLabel); corps.appendChild(label); corps.appendChild(champCree); corps.appendChild(lien); corps.appendChild(saut); } Je voudrais aussi associer un evenement aux liens crees, a chaque click sur un lien precis toute la ligne de ce lien doit disparaitre. function supprimer() { var corps = document.getElementById("identifiant"); var lienChoisi = (document.all)?event.srcElement:event.target; var parent = lienChoisi.parentNode; //place la variable parent sur le noeud parent de node var grandParent = parent.parentNode; //place la variable parent sur le noeud parent de node grandParent.removeChild(parent); }
Merci d'avance.
Partager