JavaScript if 语句忽略条件

Question

我有一个 JavaScript 代码来验证我的联系表单并执行 POST 到 PHP 脚本，问题是脚本忽略 IF 语句并在我的 validateForm 函数的响应为假时执行发布。

如果 validateForm() 返回 false，它仍在执行 POST 操作

这是带有函数结果的控制台打印

我的 JS 代码：

    $(document).ready(function() {
    $("form[name='contactf']").submit(function(e) {             
        // do the extra stuff here      
        e.preventDefault();
        console.log(validateForm());
        if(validateForm()){                     
            $.ajax({                
                type: "POST",
                url: "mail.php",
                data: $(this).serialize(),            
                success: function(data) {                   
                    if(data.message == 'success'){                      
                        M.toast({html: 'Mensagem enviada com sucesso!'})
                        $('#first_name').val('');
                        $('#last_name').val('');
                        $('#subject').val('');
                        $('#email').val('');
                        $('#phone').val('');
                        $('#details').val('');
                    }else if(data.message == 'error'){
                        M.toast({html: 'Ops... Tente novamente dentro de alguns minutos.'})
                    }
                }
            })
        }
        else
            ;
    })
    function validateForm()
    {
        var name=document.forms["contactf"]["first_name"].value;
        var surname=document.forms["contactf"]["last_name"].value;
        var subject=document.forms["contactf"]["subject"].value;
        var mail=document.forms["contactf"]["email"].value;
        var phone=document.forms["contactf"]["phone"].value;
        var details=document.forms["contactf"]["details"].value;
        var isnum = /^\d+$/.test(phone);        
        if(!isnum){
            M.toast({html: 'O telefone deve conter apenas números!'});
            return false;
        }       
        else if (!name || !surname || !subject || !mail || !phone || !details)
        {
            M.toast({html: 'Preencha todos os campos!'})
            return false;
        }
        else
            return true;        
    }   
    function id( el ){
        return document.getElementById( el );
    }
})  

Answer 1

你的布尔逻辑是错误的。

如果 value 为 null 或空字符串，则可以使用 !value 生成 true，然后 OR他们都使用||。

这是基于类型强制转换为布尔值，有关更多信息，请参见例如this MDN page

例子：

function validateForm(v1, v2, v3) {
  var name = v1;
  var surname = v2;
  var subject = v3;

  if (!name || !surname || !subject)
    return false;
  else
    return true;
}

console.log(validateForm(null, null, null));
console.log(validateForm(null, "", "Test"));
console.log(validateForm("John", "Smith", "Test"));

Answer 2

您需要更改else if 条件。 将条件写成：

else if (name==null || name=="" || surname==null || surname=="" || subject==null || subject=="" || mail==null || mail=="" || phone==null || phone=="" || details==null || details=="")

请勿使用 逗号 (,) 进行分隔。