Estoy MUY familiarizado con Javascript y HTML, recién comencé a estudiar TI y esta es mi primera evaluación. Esencialmente, la tarea es: proporcionar una lista desplegable y un cuadro de entrada de edad, proporcionar un botón "Enviar" y agregar un cuadro de alerta con JS que muestre si el usuario ha ingresado los detalles correctos para continuar. (Nueva Zelanda y 18 (o más) son las respuestas "correctas" para continuar; otras opciones de países y menos de 18 obtienen una respuesta de alerta de rechazo)
Aquí está mi HTML hasta ahora:
<body> <form method="get"> <select id="country" name="country"> <option value="0">PLEASE SELECT YOUR COUNTRY</option> <option value="1">New Zealand</option> <option value="2">Australia</option> <option value="3">Switzerland</option> </select> <input type="number" id="dob"> </form> <button type="button" id="submit" >SUBMIT</button> <script src="test.js"></script> </body>Intenté usar Javascript (var como se muestra a continuación) y también la función (con la que me confundí y eliminé):
var select = document.getElementById("country"); document.getElementById("button").onclick = function(){ var value = select.value if (value == "1") { alert("Thanks"); } if (value == "2") { alert("sorry"); } if (value == "3") { alert("sorry"); } if (value == "0") { alert("sorry"); } };Su identificación en document.getElementById("button").onclick es incorrecta. la identificación es enviar, no el botón
var select = document.getElementById("country"); document.getElementById("submit").onclick = function(){ var value = select.value if (value == "1") { alert("Thanks"); } if (value == "2") { alert("sorry"); } if (value == "3") { alert("sorry"); } if (value == "0") { alert("sorry"); } };He refactorizado tu código. Debería funcionar así
const select = document.getElementById("country"); const inp = document.getElementById("dob"); document.getElementById("submit").onclick = function(){ const selected = select.value; const dob = parseInt(inp.value); if( selected === "1" && dob >= 18 ){ alert("Thanks"); } else { alert("Sorry"); } }; <form method="get"> <select id="country" name="country"> <option value="0">PLEASE SELECT YOUR COUNTRY</option> <option value="1">New Zealand</option> <option value="2">Australia</option> <option value="3">Switzerland</option> </select> <input type="number" id="dob"> </form> <button type="button" id="submit" >SUBMIT</button>