Es un formulario simple con una acción que debe ir a "nextPage.html". solo tiene 1 entrada que es una casilla de verificación y un botón de envío.
const form = document.getElementById('form') const checkbox = document.getElementById('checkbox') const message = document.getElementById('message') form.addEventListener('submit', function validateCheckbox(e) { e.preventDefault() if (checkbox.checked === true) { message.innerHTML = 'Done' } else { message.innerHTML = 'Please check the box to continue!' } }) <div class="container"> <form method="post" action="nextPage.html" id="form"> <label for="checkbox">By continuing, I agree that I have read and understand the terms of service.</label> <br> <input type="checkbox" id="checkbox"> <button type="submit">Submit</button> <h5 id="message"></h5> </form> </div>e.currentTarget.submit(); enviará "manualmente" el formulario después de que haya verificado que la casilla de verificación está marcada. También nota al margen, siempre se recomienda incluir terminaciones de línea de punto y coma.
const form = document.getElementById('form'); const checkbox = document.getElementById('checkbox'); const message = document.getElementById('message'); form.addEventListener('submit', function validateCheckbox(e) { e.preventDefault(); if (checkbox.checked === true) { message.innerHTML = 'Done'; e.currentTarget.submit(); } else { message.innerHTML = 'Please check the box to continue!'; } }) <div class="container"> <form method="post" action="nextPage.html" id="form"> <label for="checkbox">By continuing, I agree that I have read and understand the terms of service.</label> <br> <input type="checkbox" id="checkbox"> <button type="submit">Submit</button> <h5 id="message"></h5> </form> </div>