javascript - Javascript 上的 IF/ELSE 工作起来很奇怪

Question

我有一个表单，我要求提供一封电子邮件，我通过正则表达式进行验证，如果电子邮件正确，我会提交，如果不正确，我会发送警报。

当我输入无效电子邮件时，会显示警报，但如果我输入有效电子邮件，则会显示警报，然后完成提交()，我什至不知道这是怎么可能的!这是我的代码。

$('#sinCopago').on('click', function(event){
    if($('#nombreContratante').val() != "" && $('#motivo').val() != ""){
        if($('#fechaNac').val() > hoy){
            alert("Ingresa una fecha de nacimiento válida.");
        }else{
            if(validarMail($("#correo")) == true){
                event.preventDefault();
                $('#progressBarSisnova').modal({show:true});
                $('#payment-form-Sisnova').submit();
            }
            else{
                alert("Ingresa un correo válido");
            }
        }
    }
    else{
        alert("Por favor llene todos los campos");
    }
});

function validarMail(email){
    var caract = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,4})+$/;

    if(caract.test(email) == false){
        return false;
    }
    else{
        return true;
    }
}

Answer 1

您目前正在通过 $("#correo") jQuery 对象 validarMail :

if(validarMail($("#correo")) == true){

并继续测试该对象:

if(caract.test(email) == false){

当然，这是行不通的，因为您没有测试字符串。尝试传递 .val()的#correo反而。这样最终的.test(使用值字符串调用，而不是 jQuery 对象:

if(validarMail($("#correo").val()) == true){

请随意删除 == true部分，validarMail已经返回一个 bool 值:

if(validarMail($("#correo").val())){

您还应该preventDefault 当测试失败时，而不是当测试成功时 - 这样，只有当测试成功时，表单才会正常提交而不会中断。如果您return，代码也可能会更扁平且更易于阅读。当出现错误时:

$('#sinCopago').on('click', function(event){
  if($('#nombreContratante').val() === "" || $('#motivo').val() === "") {
    event.preventDefault();
    return alert("Por favor llene todos los campos");
  }
  if($('#fechaNac').val() <= hoy){
    event.preventDefault();
    return alert("Ingresa una fecha de nacimiento válida.");
  }
  if(!validarMail($("#correo").val())){
    event.preventDefault();
    return alert("Ingresa un correo válido");
  }
  $('#progressBarSisnova').modal({show:true});
  $('#payment-form-Sisnova').submit();
});

如果点击#sinCopago提交表单时不带 preventDefault ，那么就不需要最后一行 $('#payment-form-Sisnova').submit(); 。 (否则，如果事件的默认操作不会导致表单提交或其他不良行为，则可能根本不需要 preventDefault)