Bonjour,
j'ai un petit programme où il y a 2 boutons , un "supprimer" (devant supprimer l'élément séléctionné dans une liste et un "restaurer" devant restaurer le dernier élément supprimé......
J'arrive à sélctionner les éléments de ma liste, mais la suppression et la restauration ne fonctionnent pas :)
voici mon code : ( le html)
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
<title>exo3.js</title>
</head>
<body>
<div class="container">
<div class="panel panel-primary">
<div class="panel-heading">Annuaire Javascript</div>
<div class="panel-body">
<p>Plantas sunt contencios de mirabilis hibrida.Nunquam desiderium fortis.
Plantas sunt contencios de mirabilis hibrida.Nunquam desiderium fortis.
Plantas sunt contencios de mirabilis hibrida.Nunquam desiderium fortis.
Plantas sunt contencios de mirabilis hibrida.Nunquam desiderium fortis.
Plantas sunt contencios de mirabilis hibrida.Nunquam desiderium fortis.
Plantas sunt contencios de mirabilis hibrida.Nunquam desiderium fortis.
</p>
</div>
</div>
<ul id="liste" class="list-group">
<li class="list-group-item">Lanctot Granville 03.94.49.02.95</li>
<li class="list-group-item">Arnaud Cheneye 05.74.47.38.93</li>
<li class="list-group-item">Daniel Truchon 04.54.59.99.06</li>
<li class="list-group-item">Roxanne Boncoeur 02.37.72.02.96</li>
<li class="list-group-item">Mallory Cinqmars 02.07.27.15.51</li>
<li class="list-group-item">Saber Boutot 01.50.22.47.39</li>
</ul>
<button id="supprimer" class="btn-primary">Supprimer</button>
<button id="restaurer" class="btn-primary">Restaurer</button>
</div>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>
<script src="js/exo3.js"></script>
</body>
</html>
et voici le js :
$liste = document.getElementById("liste");
$supprimer = document.getElementById("supprimer");
$restaurer = document.getElementById("restaurer");
function select(e) {
e.target.classList.toggle("selected");
}
function supprimer() {
for (i = 0; i < $liste.children.length; i++) {
if ($liste.children[i].classList.contains("selected")) {
$liste.children[i].classList.add("poubelle");
}
}
}
function restaurer() {
for (i = 0; i < $liste.children.length; i++) {
$liste.children[i].classList.remove("poubelle");
}
}
$liste.onclick = select;
$supprimer.onclick = supprimer;
$restaurer.onclick = restaurer;
si vous avez une idée de ce qui merde ...... ;)