function install() { const form = document.getElementById('install'); form.addEventListener('submit', (event) => { event.preventDefault() }); } function mostrar(){ var allTags = []; var ids = document.body.getElementsByTagName('input'); for (var i = 0; i< ids.length; i++) { allTags.push(ids[i].id); } } </head> <body> <div class="quiz-container" id="quiz" multiple> <div class="quiz-header"> <h2 id="question">select the programs you wanted to install: </h2> <form action="/signup" method="post" id="install"> <ul> <li> <input type="checkbox" name="1" id="a" class="answer" /> <label for="a" id="a_text">Teams</label> </li> <li> <input type="checkbox" name="2" id="b" class="answer" /> <label for="b" id="b_text">VPN</label> </li> <li> <input type="checkbox" name="3" id="c" class="answer" /> <label for="c" id="c_text">FDC</label> </li> <li> <input type="checkbox" name="4" id="d" class="answer" /> <label for="d" id="d_text">Acrobat Reader</label> </li> <li> <input type="checkbox" name="5" id="e" class="answer" /> <label for="e" id="d_text">Power BI</label> </li> </ul> </form> </div> <button id="submit">Install</button> </div> </body>Para obtener las identificaciones de la entrada marcada, debe recorrer todas las input y verificar con el atributo .checked .
document.querySelector('#getIDs').addEventListener('click', function(){ var allTags = []; document.querySelectorAll('input').forEach(function(input){ if(input.checked){ allTags.push(input.id) } }) console.log('IDs:', allTags) }) </head> <body> <div class="quiz-container" id="quiz" multiple> <div class="quiz-header"> <h2 id="question">select the programs you wanted to install: </h2> <form action="/signup" method="post" id="install"> <ul> <li> <input type="checkbox" name="1" id="a" class="answer" /> <label for="a" id="a_text">Teams</label> </li> <li> <input type="checkbox" name="2" id="b" class="answer" /> <label for="b" id="b_text">VPN</label> </li> <li> <input type="checkbox" name="3" id="c" class="answer" /> <label for="c" id="c_text">FDC</label> </li> <li> <input type="checkbox" name="4" id="d" class="answer" /> <label for="d" id="d_text">Acrobat Reader</label> </li> <li> <input type="checkbox" name="5" id="e" class="answer" /> <label for="e" id="d_text">Power BI</label> </li> </ul> </form> </div> <button id="getIDs">getIDs</button> </div> </body>Mueva su botón dentro de su formulario y agregue el tipo de envío correcto.
<button type="submit">Install</button>Luego, en tu función mostrar puedes hacer:
var selectedTags = document.querySelectorAll('.answer:checked').forEach(function(element) { console.log(element.id) });