Estoy tratando de hacer una actividad en mi clase de desarrollo web, pero me encontré con un problema que parece tan simple, pero parece que no puedo entenderlo. He probado otras soluciones, pero aún no entiendo qué está mal o qué falta en mi código.
Quiero que mi programa analice la edad y la identifique, para sobrescribir en el id de párrafo de agetext, el grupo de edad (niños, edad temprana para trabajar...)
<html> <body> <h1>Age Group Identifier</h1> <p></p>To find out the category of an age group, please enter the age below.</p> <form id="agegroupidentifier"> Age: <input id="agein" type="text"><br> <input type="button" onclick="ageInput();" value="Submit"> <p ="agetext"></p> </form> <script> function ageInput() { var ageInp=document.getElementById("agein").value; } if (agein =< 14) { document.getElementById("agetext").innerHTML="Children"; } else (agein =< 24) document.getElementById("agetext").innerHTML="Early Working Age"; } else (agein =< 54) document.getElementById("agetext").innerHTML="Prime Working Age"; } else (agein =< 64) document.getElementById("agetext").innerHTML="Mature Working Age"; } else (agein > 64) document.getElementById("agetext").innerHTML="Elderly"; } </script> </body> </html>Hay muchos problemas con su código:
Su etiqueta p parece tener un atributo de id incorrecto. Cambie <p ="agetext"></p> a <p id="agetext"></p>
Hay muchas más llaves de cierre } que llaves de apertura { - deben coincidir.
La variable agein nunca se asigna y siempre estará indefinida, es posible que ageInp deba cambiarse de nombre agein . Aún mejor use ageIn .
El operador menor o igual es <= not =< .
El tipo de entrada de botón intentará automáticamente enviar el formulario a menos que haga una llamada a preventDefault() en el parámetro de evento de los controladores.
Suponiendo que ageInp debe ser ageIn , deberá analizar el valor de la cadena en un número para hacer comparaciones numéricas significativas; de lo contrario, todas las comparaciones se basarán en cadenas donde '10' es menor que '3' .
Las cláusulas else deben ser completas if () no puede hacer else ()
innerHTML probablemente debería ser innerText a menos que realmente quiera crear elementos HTML secundarios.
su primer elemento p se cierra inmediatamente sin encerrar el texto junto con un cierre final ignorado </p>
Junto con todos estos cambios, también configuraría el innerText en un solo lugar y usaría una variable para mantener el texto apropiado listo para insertarlo en la página.
function ageInput(event) { event.preventDefault(); var ageIn = parseInt(document.getElementById("AgeIn").value); var ageText = ''; if (ageIn <= 14) ageText = "Children"; else if(ageIn <= 24) ageText = "Early Working Age"; else if (ageIn <= 54) ageText = "Prime Working Age"; else if (ageIn <= 64) ageText = "Mature Working Age"; else ageText = "Elderly"; document.getElementById("AgeText").innerText = ageText; } <h1>Age Group Identifier</h1> <p>To find out the category of an age group, please enter the age below.</p> <form id="agegroupidentifier"> Age: <input id="AgeIn" type="text"><br> <input type="button" onclick="ageInput(event);" value="Submit"> <p id="AgeText"></p> </form>