Así que ahora tengo mi código exitoso. Pero lo que quiero hacer es incluir esto en mi AJAX. Así que este es mi AJAX:
function checkEmail() { // var myForm = $("#mainForm").serialize(); var fname = $("#first").val(); var lname = $("#second").val(); var email = $("#email").val(); var password = $("#password").val(); var repass = $("#en").val(); if (fname && lname && email && password && repass && password.length >= 6 && password == repass)) { jQuery.ajax({ url: "connection.php", data: { fname:fname, lname:lname, email:email, password:password, repass:repass }, type: "POST", success:function(data){ $("#emailExists").show(); $("#email").css("border","2px solid green"); $("#no").css("visibility","hidden"); $("#yes").css("visibility","visible"); if(data){ $("#email").css("border", "2px solid red"); $("#no").css("visibility","visible"); $("#yes").css("visibility","hidden"); }else { $("#email").css("border", "2px solid green"); $("#no").css("visibility","hidden"); $("#yes").css("visibility","visible"); window.location.href = 'home.php'; } $("#emailExists").html(data); }, error:function (){ } }); } }Entonces, lo que quiero hacer, es básicamente, en esa declaración if [if(name && lname...)]. En esa sección en particular, quiero incluir esta verificación particular si el sistema de correo electrónico también es válido. Así que estaba pensando en convertir este código (la declaración if para verificar si el correo electrónico es válido) en una función, para luego agregarlo a AJAX, algo como esto:
if (fname && lname && email && password && repass && password.length >= 6 && password == repass && checkValidateEmail()) {Pero si mantengo esa instrucción if en una función llamada checkValiateEmail() y hago eso, no funciona. ¿Qué tengo que hacer?
Su error está en la línea 20 (de mi fragmento, ver más abajo). Está pasando su HTMLElement de email electrónico a la función validateEmail() , no el valor de entrada. El código correcto es el siguiente, tenías validateEmail(email) .
if(email.value === ""){ // ... } else if (!validateEmail(email.value)){ // <- the error was here // ... } else{ // ... }El código de trabajo completo es entonces:
function validateEmail(email) { const re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; return re.test(email); } const email = document.getElementById("email"); const no = document.getElementById("no"); const yes = document.getElementById("yes"); const mailText = document.getElementById("email-text"); const validEmail = document.getElementById("valid"); email.addEventListener("change", function(){ if(email.value === "") { no.style.visibility = 'visible'; yes.style.visibility = 'hidden'; email.style.border = '2px solid red'; mailText.style.visibility = 'visible'; mailText.innerText = "Please enter an email address."; validEmail.style.visibility = 'hidden'; } else if (!validateEmail(email.value)) { no.style.visibility = 'visible'; yes.style.visibility = 'hidden'; email.style.border = '2px solid red'; mailText.style.visibility = 'hidden'; validEmail.style.visibility = 'visible'; } else { yes.style.visibility = 'visible'; no.style.visibility = 'hidden'; email.style.border = '2px solid green'; mailText.style.visibility = 'hidden'; } }); <input type="text" id="email" /> <span id="yes">Yes</span> <span id="no">No</span> <span id="valid">Valid</span> <p id="email-text"></p>