我是JS的初学者,我想进行基本的HTML和JS验证。如何用2个输入(数字和提交)来完成?



    var edad =  document.getElementById("edad"),
 	    numero = edad.numero

    function validacion(){
        if (numero >= 18) {
      	   alert("eres mayor de edad");
        } else {
           alert("eres menor de edad");
        }
    }


 	edad.addEventListener("submit", validacion);

    <!DOCTYPE html>
    <html>
    <head>

	    <title></title>
    </head>
    <body>
	    <div id="edad">
		   <input type="number" name="numero"  class="numero">
		   <input type="submit" name="btn" value="enviar" class="btn">
		   <script type="text/javascript" src="1.js"></script>
	   </div>
</body>
</html>

最佳答案

您正在submit上设置一个事件监听器,该监听器指向div,但是div没有submit事件。

另外,您需要获取valueinput并进行比较,而不是input元素本身。

另外,edad.numero不是访问input元素的正确方法。

最后,从HTML到JavaScript的所有数据都是字符串,因此您需要将其转换为数字以对其进行数学运算。

如果在form元素上设置有效的侦听器,并引用input正确性,则代码将触发:



var edad =  document.getElementById("edad");
var numero = document.querySelector("input[name='numero']");

function validacion(event){
  event.preventDefault(); // prevents the form from submitting
  // The + converts the string to a number
  // And, you must get the value of the input, not the input itself
  if (+numero.value >= 18) {
    alert("eres mayor de edad");
  } else {
    alert("eres menor de edad");
  }
}

edad.addEventListener("submit", validacion);

<form id="edad">
  <input type="number" name="numero"  class="numero">
	<input type="submit" name="btn" value="enviar" class="btn">
</form>

10-07 18:56
查看更多