tengo una funcion con addEventListener, que cuando aprieto un boton me cambia el texto de un
, pero en el momento que hago click , me muestra el texto que cambia por 1 milisegundo y vuelve a su estado actual, por que sera?
Aca pongo el codigo a continuacion
let $botonCalcular = document.getElementById("botonCalcular");
$botonCalcular.addEventListener("click",ClickenCalcular);
function ClickenCalcular(){
let $nombreUsuario= document.querySelector('#nombre-usuario').value;
let $edadUsuario= document.querySelector("#edad-usuario").value;
let edadAutorizada = 18;
let textoResultado;
if ($edadUsuario => edadAutorizada)
{
textoResultado= "Hola "+$nombreUsuario +" puedes ingresar"
}
else
{
textoResultado= "Hola "+$nombreUsuario +" no puedes ingresar"
}
document.querySelector("#resultado1").innerText=textoResultado;
}
<!doctype html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=GFS+Didot">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:200">
<link rel="stylesheet" href="bienvenida.css">
<title>Entrada bar</title>
</head>
<body>
<div class="contenedor">
<div id="header">
<header>
<h1>Login bar</h1>
</header>
</div>
<form id="formulario">
<input type="text" placeholder="Ingresá tu nombre" id="nombre-usuario"/>
<input type="number" placeholder="Ingresá tu nombre" id="edad-usuario"/>
<input type="submit" value="Ingresar" id="botonCalcular" class="button"/>
</form>
<div id="resultado">
<p id="resultado1">Resultado</p>
</div>
<div id="footer">
<footer>Proyecto para /r argentina</footer>
</div>
</div>
<script type="text/javascript" src="bienvenida.js"></script>
</body>
</html>
if ($edadUsuario => edadAutorizada)
el operador está invertido, debe ser>=
(a no ser que estés pretendiendo usar una función flecha)