Estoy tratando verificar un formulario e intento que usando un innerHTML coloque en un párrafo los errores que hubo pero el texto aparece y luego desaparece solo sale durante unos segundos, creo que se debe a que se recarga la pagina pero no se detener la recarga soy algo nuevo. Mi código JS:
const name = document.getElementById('name')
const last = document.getElementById('lastname')
const email = document.getElementById('email')
const quest = document.getElementById('quest')
const form = document.getElementById('form')
const text = document.getElementById('warnings')
form.addEventListener("submit", e=>{
e.defaultPrevented()
let warnings = ''
let send = false
let regexEmail = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/
text.innerHTML = 'enviado'
if(name.value.length < 3) {
warnings += 'El nombre no es valido <br>'
send = true
}
if(last.value.length < 3) {
warnings += 'El apellido no es valido <br>'
send = true
}
if(regexEmail.test(email.value)) {
warnings += 'El email no es valido <br>'
send = true
}
if(quest.value.length < 15 ) {
warnings += 'Lo que sabes hacer es muy poco <br>'
send = true
}
if(send) {
text.innerHTML = warnings
}
return false
})
Y mi código HTML:
<form id="form">
<input type="text" id="name" name="name" placeholder="nombre(s)" required><input type="text" id="lastname" name="lastname" placeholder="apellidos" required><br>
<input type="email" id="email" name="email" placeholder="correo electronico" required><br>
<textarea id="quest" name="quest" rows="10" cols="50" placeholder="que sabes hacer..." required></textarea><br>
<button class="boton-save">enviar</button>
</form>
<p id="warnings">
</p>