Formulaire qui ne s'affichent pas au clic sur bouton
Posté : 30 juil. 2020, 10:35
Bonjour, Quand je clique sur le bouton, le formulaire ne s'affichent pas. Voici mon code :
index.html
js/script.js
Merci pour votre aide & bonne journée
index.html
Code : Tout sélectionner
<!DOCTYPE html>
<html lang="fr">
<head>
<title>Correspondance américaine d'une note de musique</title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/script.js"></script>
</head>
<body>
<div id="wrapper">
<header>
<h1>Correspondance américaine d'une note de musique</h1>
</header>
<main>
<input type="button" id="notation" value="notation">
</main>
</div>
</body>
</html>
Code : Tout sélectionner
(function() {
var poster = {
init: function() {
window.addEventListener("load", function(event) {
var notation = document.getElementById("notation");
var backgroundColor1 = "green";
var color1 = "white";
function setBackgroundColor1(element) {
element.style.backgroundColor = backgroundColor1;
}
function setColor1(element) {
element.style.color = color1;
}
notation.addEventListener("click", function(event) {
setBackgroundColor1(this);
setColor1(this);
var form = document.createElement("form");
var label = document.createElement("label");
var select = document.createElement("select");
var paragraphe = document.createElement("p");
form.appendChild(label);
label.appendChild(select);
form.appendChild(paragraphe);
document.getElementsByTagName("main").appendChild(form);
var notes = {
"" : "",
"C" : "Do",
"D" : "Re",
"E" : "Mi",
"F" : "Fa",
"G" : "Sol",
"H" : "La",
};
for(var key in notes) {
var option = document.createElement("option");
option.value = key;
option.textContent = notes[key];
select.appendChild(option);
}
select.addEventListener("change", function() {
paragraphe.textContent = "La notation américaine pour la note " +
select.options[this.selectedIndex].textContent + " est " + this.value;
});
});
});
}
};
poster.init();
})();