Uso el siguiente código para verificar si todos los campos del formulario no están vacíos antes de que se active el botón Enviar.
<script type="text/javascript"> function checkForm() { var cansubmit = false; $('form input[type="text"]').each(function (index, element) { if (element.value == "") { cansubmit = true; } }); document.getElementById("uploadButton").disabled = cansubmit; } </script>¿Cómo puedo editar este código para que verifique si el campo de correo electrónico contiene una dirección de correo electrónico antes de que se active el botón Enviar?
ACTUALIZAR
Cambié el código a esto y parece funcionar. Comprueba si contiene @ (y no como primer símbolo) y . (y no como el tercer símbolo).
¿Es este un código lógico o debería ser más fácil?
<script type="text/javascript"> function checkForm() { var cansubmit = false; $('form input[type="text"]').each(function (index, element) { if (element.value == "") { cansubmit = true; } }); $('form input[type="email"]').each(function (index, element) { if (element.value.indexOf("@") <= 0) { cansubmit = true; } else if (element.value.indexOf(".") <= 2) { cansubmit = true; } }); document.getElementById("uploadButton").disabled = cansubmit; } </script>Puede usar una expresión regular de esta respuesta para validar la dirección de correo electrónico:
if ((element.value == "" && element.type != "email") || (element.type == "email" && !/([!#-'*+/-9=?AZ^-~-]+(\.[!#-'*+/-9=?AZ^-~-]+)*|"([]!#-[^-~ \t]|(\\[\t -~]))+")@([0-9A-Za-z]([0-9A-Za-z-]{0,61}[0-9A-Za-z])?(\.[0-9A-Za-z]([0-9A-Za-z-]{0,61}[0-9A-Za-z])?)*|\[((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|IPv6:((((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){6}|::((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){5}|[0-9A-Fa-f]{0,4}::((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){4}|(((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):)?(0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}))?::((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){3}|(((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){0,2}(0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}))?::((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){2}|(((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){0,3}(0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}))?::(0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):|(((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){0,4}(0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}))?::)((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):(0|[1-9A-Fa-f][0-9A-Fa-f]{0,3})|(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3})|(((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){0,5}(0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}))?::(0|[1-9A-Fa-f][0-9A-Fa-f]{0,3})|(((0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}):){0,6}(0|[1-9A-Fa-f][0-9A-Fa-f]{0,3}))?::)|(?!IPv6:)[0-9A-Za-z-]*[0-9A-Za-z]:[!-Z^-~]+)])/.test(element.value))) {Use una combinación de <input type="email"> e inputElement.validity para verificar si la entrada es válida. Documentos