5

我是 javascript 新手,所以如果这完全错误,我深表歉意,但我现在正在尝试验证表单,并且我有简单的测试功能。我希望函数 validateForm() 返回所有三个函数 checkName()、checkEmail 和 checkMessage()。我拥有 validateForm() 函数的方式,它只运行 checkName() 函数。有任何想法吗?

function checkName(){

    var name=document.forms["contactForm"]["Name"].value;

    if(name==null || name==""){
        $("input#name").css("border-color", "#ff0000");
        $("input#name").attr("placeholder","Your name is required");
        return false;    
    }    
    else {
        $("input#name").css("border-color", "#00a8ff");
        $("input#name").attr("placeholder","");
        return true;
    }    
}

function checkEmail(){

    var email=document.forms["contactForm"]["Email"].value;

    if(email==null || email==""){
        $("input#email").css("border-color", "#ff0000");
        $("input#email").attr("placeholder","Your email is required");
        return false;    
    }    
    else {
        $("input#email").css("border-color", "#00a8ff");
        $("input#email").attr("placeholder","");
            return true;
        }
}

function checkMessage(){

    var message=document.forms["contactForm"]["Message"].value;

    if(message==null || message==""){
        $("textarea#message").css("border-color", "#ff0000");
        $("textarea#message").attr("placeholder","Your message is required");
        return false;    
    }    
    else {
        $("textarea#message").css("border-color", "#00a8ff");
        $("textarea#message").attr("placeholder","");
        return true;
    }
}

function validateForm(){

    return checkName() && checkEmail() && checkMessage();

}
4

7 回答 7

8

运算符 && 执行左操作数(在您的情况下为 checkName ),如果为假,则立即返回假而不执行右操作数。因此,您需要手动执行每个函数,然后才能通过 && 连接它们。

function validateForm(){
    var a = checkName();
    var b = checkEmail();
    var c = checkMessage();
    return a && b && c;
}
于 2012-07-08T18:14:43.717 回答
4
 var yourdomain = {};
 yourdomain.validateFormField = function(){
 var domNameElement = document.getElementById("name");
 var domMailElement = document.getElementById("mail");
 var domMsgElement  = document.getElementById("msg");

 return {
           validateName: function (){
           /*your checkName() code goes here with a function return*/;
           `enter code here`},

           validateMail: function (){
            /*your checkEmail() code goes here with a function return*/;
           },

           validateMsg: function (){
            /*your checkMessage() code goes here with a function return*/;
           },
       };
  }

你可以这样称呼它。

yourdomain.validateFormField.validateName()

或者

yourdomain.validateFormField.validateMail()

或者

yourdomain.validateFormField.validateMsg()

视需要而定。

于 2013-09-25T04:30:24.660 回答
1

由于短路评估,您目前拥有的方式尝试按顺序评估它们。如果其中一项返回 false,则该过程结束。

短路表达式 x Sand y(用 Sand 表示短路变种)等价于条件表达式 if x then y else false;表达式 x Sor y 等价于 if x then true else y。

您想分别调用这些函数来执行每个检查:

function validateForm(){
    var results = [];
    result[0] = checkName();
    result[1] = varcheckEmail();
    result[2] = checkMessage();
}
于 2012-07-08T18:13:44.753 回答
1

您遇到的情况称为短路。Javascript 逻辑运算符会做短路。这意味着如果您有表达式test1() && test2()并且第一个函数返回 false,那么整个表达式将始终评估为 false,但第二个函数返回什么。因此第二个函数永远不会被调用。如果第一个函数返回 true,则将调用第二个函数,因为它实际上会影响表达式的计算。

因此,如果checkName()返回 false,则不会调用其他函数。如果它返回true,那么checkEmail()将被调用。如果它也返回 true,那么checkMessages()也将被调用。但是,如果任何函数返回 false,则由于短路,其余函数将不会被评估。

于 2012-07-08T18:18:06.953 回答
1

在我的 javascript 项目中,我这样做了。

return {
   checkName : checkName,
   checkEmail : checkEmail,
   checkMessage : checkMessage,
   validateForm : validateForm
};
于 2016-05-23T02:27:32.023 回答
0

如果 checkName() 为 false,则不会执行其他函数,因为结果仍然为 false。

于 2012-07-08T18:15:19.583 回答
0

我做的和别人有点不一样。创建一个数组,添加我的验证方法的所有结果,然后比较每个值(AND);

function ValidateInputs() {
    var arrValidations = new Array();

    arrValidations.push(ValidateProponentDocument());
    arrValidations.push(ValidateProponentName());
    arrValidations.push(ValidateProponentBirthdate());

    var ret = true;
    $.each(arrValidations, function (index, item) {
        ret &= item;
    });      

    return ret;
}
于 2014-04-10T14:16:01.447 回答