0
Можно ли снять задание после его проверки? если я проверю задачу, она станет красной в строке, но я хочу снова щелкнуть ее, а затем вернуться к нормальной.снимите флажок, чтобы сделать элемент javascript
Есть ли простой способ заполнить это?
JS
var takenLijst = document.getElementById('takenLijst');
var invulVeld = document.getElementById('invulVeld');
var voegToe = document.getElementById('voegToe');
var verwijderLijst = document.getElementById('verwijder');
var list = [];
voegToe.addEventListener('click', function() {
event.preventDefault();
takenLijst.innerHTML = '';
if (invulVeld.value !== '') {
list.push(invulVeld.value);
invulVeld.value = '';
}
for (var i=0; i < list.length; i++) {
takenLijst.innerHTML += '<li>' + list[i] + '</li>';
}
invulVeld.focus();
});
takenLijst.addEventListener('click', function() {
var taak = event.target;
if (taak.tagName === 'LI') {
taak.className = "checked";
}
});
verwijderLijst.addEventListener('click', function() {
list.length = 0;
takenLijst.innerHTML = '';
});
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>To do list</title>
<link rel="stylesheet" type="text/css" href="/css/ToDo.css">
</head>
<body>
<form>
<input type="text" id="invulVeld"/><button id="voegToe">Taak</button><button id="verwijderLijst">Verwijder lijst</button>
</form>
<ul id="takenLijst">
</ul>
<script src="js/ToDo.js"></script>
</body>
</html>
Подсказка. Простым способом является использование .toggleClass() в jquery. Объявите подходящий класс css для его красной и вычеркнутой ... затем в вашем коде jquery добавьте обработчик событий в свой флажок, проверьте, установлен ли он или нет, затем переключите класс, если флажок установлен или нет. , Или, если вы хотите использовать метод Vanilla JS, используйте .classList.remove() или .classList.add() для управления классом –