I want a checkbox to vanish, when checked with JavaScript. Problem is, that the checkbox(es) are generated dynamically with the function checkboxAd()
:
function checkboxAd() {
let boxes = document.getElementById("inputPomo").value;
let numBox = parseInt(boxes, 10);
let boxAdd = document.createElement("li");
let ulBox = document.getElementById("listPomo");
for (let i = 0; i < numBox; i++) {
let boxAdd = document.createElement("INPUT");
boxAdd.setAttribute("type", "checkbox");
ulBox.appendChild(boxAdd);
}
}
The above function is triggered, when a number is entered in an input field with the ID="inputPomo"
. The number of checkboxes appears related to the number entered.
When a certain task is accomplished I want to check the checkbox, so that the checkbox vanishes.
All examples I find deals with situations where the checkbox is placed in the HTML. But in this case, the checkboxes are generated by JS. Sorry for misuse of terminology, help welcome.
The HTML part where the parent of the checkbox appears id="listPomo"
<div>
<input id="inputTodo" placeholder="What needs to be done?" />
<input id="inputPomo" placeholder="How many Pomodoros?" />
<ul id="listTodo"></ul>
<ul id="listPomo"></ul>
<button id="tasker">Save Task</button>
</div>
I don't know, how I place an eventlistener for an onchange (?) event which is generated by JS. Only the certain checked checkbox should vanish. (So if there are three checkboxes, two should stay…)
Aucun commentaire:
Enregistrer un commentaire