Intégration "OnClick" dans un bouton en JS
Bonjour,
Merci à tous pour ces supers forums.
Je débutte, en JS (et notamment en programmation non typé) et j'essaie de faire des tuto developpez.com.
J'essaie désespérément à partir du script JS de rajouter à une liste de bouton (stoqué dans un tableau). Mais voila, lorsque j’exécute mon scripte,et que je regarde dans les éléments de mon document, l'attribut "onclick" n'est pas cérée.
voici mon script:
Code:
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
| function maina()
{
console.log("Script");
//création des input de type Text
elInput = new Array();
elInput[0]=document.createElement("input");
elInput[0].type="text";
elInput[0].id="Input0";
elbutton =new Array;
elbutton [0]=document.createElement("button");
elbutton [0].id="Button0"
//Tableau contenant les options de la liste
elForm=document.getElementById("formulaire");
objLigneDeFin=document.getElementById("ligneFin");
elForm.insertBefore(elInput[0],objLigneDeFin);
elForm.insertBefore(elbutton[0],objLigneDeFin);
}
function add()
{
console.log("add");
var i=elInput.length;
console.log(i);
elInput[i]=document.createElement("input");
elInput[i].type="text";
elInput[i].id="Input"+i;
elbutton[i]=document.createElement("button");
elbutton[i].onclick=function(){alert("test");};
elbutton[i].id="Button"+i;
var objBr=document.createElement("Br");
elForm.insertBefore(objBr,objLigneDeFin);
elForm.insertBefore(elInput[i],objLigneDeFin);
elForm.insertBefore(elbutton[i],objLigneDeFin);
} |
le HTML (Qui a priori ne sert pas à grand chose pour ce problème):
Code:
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
| <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
Remove this if you use the .htaccess -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>Test 1: Developper.com</title>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body onload="maina()">
<div>
<header onload="">
<h1>Header</h1>
<form id="formulaire">
<hr id="ligneFin"\>
</form>
<button id="bouton1" onclick="add()">ADD</button>
</header>
<nav>
<h1>Menu</h1>
</nav>
<div >
</div>
<footer>
<h1>Footer</h1>
</footer>
</div>
</body>
</html> |
auriez vous des idées sur ce problème?
Merci d'avance de toute votre aide,