0

我怎样才能结合这两个功能，使他们都工作？现在，我只能让一个来验证，而不是另一个。

JAVASCRIPT 示例：

function validateForm() {

var x=document.forms["giftCert"]["gift_name"].value;

if (x==null || x=="") {

errMsg = "The recpient's name is required.";              
    $("div#emptyName").show();
    $("div#emptyName").html(errMsg);

return false;
  }
}

function validateForm() {

var x=document.forms["giftCert"]["gift_email"].value;

if (x==null || x=="") {

errMsg2 = "The recpient's email address is required.";              
    $("div#emptyEmail").show();
    $("div#emptyEmail").html(errMsg2);

return false;
  }
}

表单 HTML 的简短版本：

<form action="http://ww6.aitsafe.com/cf/voucher.cfm" method="post" name="giftCert" onsubmit="return validateForm()"  />
    *Name:<input type="text" name="gift_name">
    <div id="emptyName" class="error"></div>

    *Email: <input type="text" name="gift_email">
    <div id="emptyEmail" class="error"></div>

    <input class="button" type="submit" value="Add to Cart" />

</form>
4

6 回答 6

1

您可以将代码放在同一个函数中。

function validateForm() {
    return ["Name", "Email"].every(function(type) {
        var lower_type = type.toLowerCase(),
            x=document.forms["giftCert"]["gift_" + lower_type].value;

        if (x==null || x=="")
            $("div#empty" + type).show().html("The recpient's " + lower_type + " is required.");
        else
            return true;
    });
}

由于大部分代码几乎相同，您可以将"Name"和"Email"值放入一个数组中，然后循环该数组，调用相同的代码，在需要的地方放入适当的值。

这使用Array.prototype.every来指示 Array 中的每个值是否通过验证。

如果任一项目验证失败，则返回undefined，循环停止并validateForm返回false。

每个通过验证的项目都返回true. 如果所有项目都通过验证，.every将返回true，并且表单继续。

如果您想确保所有验证都运行，您可以使用.filter(), 并true在失败时返回，以便它将一个项目添加到结果数组中。如果没有失败，则 Array 将为空。

然后测试.lengthArray 的 ，并返回与 的比较0。

function validateForm() {
    return ["Name", "Email"].filter(function(type) {
        var lower_type = type.toLowerCase(),
            x=document.forms["giftCert"]["gift_" + lower_type].value;

        if (x==null || x=="") {
            $("div#empty" + type).show().html("The recpient's " + lower_type + " is required.");
            return true;
        }
    }).length === 0; // will be true if no validation failures
}
于 2012-09-12T01:46:10.260 回答
0

完成后让它调用第二个。

或者有一个调用它们的第三个函数，并在你的 onsubmit 中有它。该函数将看到两个函数的返回值，并且仅当它们都返回 true 时才返回 true。

或者只是将第二个的代码放在第一个中，因为无论如何它都是相似的。您也可以摆脱一些重复的代码。

于 2012-09-12T00:59:36.223 回答
0

当您重用相同的函数名称时，每个后续函数声明都将覆盖任何前面的条目。将验证保存在单独的函数中可能是最简单的，因此您应该适当地命名它们并创建一个驱动程序函数来调用它们。例子：

function validateForm() {
  return validateName && validateEmail();
}

function validateName() {

  var x=document.forms["giftCert"]["gift_name"].value;

  if (x==null || x=="") {

    errMsg = "The recpient's name is required.";              
    $("div#emptyName").show();
    $("div#emptyName").html(errMsg);

    return false;
  }

  return true;
}

function validateEmail() {

  var x=document.forms["giftCert"]["gift_email"].value;

  if (x==null || x=="") {

    errMsg2 = "The recpient's email address is required.";              
    $("div#emptyEmail").show();
    $("div#emptyEmail").html(errMsg2);

    return false;
  }

  return true;
}

此外，您可以将两者结合起来，但这几乎没有那么灵活：

function validateForm() {

  var name =document.forms["giftCert"]["gift_name"].value;

  if (name == null || name == "") {

    errMsg = "The recpient's name is required.";              
    $("div#emptyName").show();
    $("div#emptyName").html(errMsg);

    return false;
  }

  var email = document.forms["giftCert"]["gift_email"].value;

  if (email == null || email == "") {

    errMsg2 = "The recpient's email address is required.";              
    $("div#emptyEmail").show();
    $("div#emptyEmail").html(errMsg2);

    return false;
  }

  return true;
}
于 2012-09-12T01:00:17.310 回答
0

简短的回答就是这样做

function validateForm() {

var x=document.forms["giftCert"]["gift_name"].value;

if (x==null || x=="") {

    errMsg = "The recpient's name is required.";              
    $("div#emptyName").show();
    $("div#emptyName").html(errMsg);

    return false;
}
x=document.forms["giftCert"]["gift_email"].value;

if (x==null || x=="") {

    errMsg2 = "The recpient's email address is required.";              
    $("div#emptyEmail").show();
    $("div#emptyEmail").html(errMsg2);

   return false;
  }
}

更长的答案是您的函数必须具有唯一的名称。此外，您在部分代码中使用 jquery 为什么不使用它来访问您的表单？此外，从 HTML 调用函数通常被认为是不好的做法。

于 2012-09-12T01:01:48.843 回答
0

一种可能的解决方案：

function validateForm() {

    var x=document.forms["giftCert"]["gift_name"].value,
        y = document.forms["giftCert"]["gift_email"].value,
        error = false;

    if ( !x ) {
        errMsg = "The recpient's name is required.";              
        $("div#emptyName").html(errMsg).show();
        error = true;
    }

    if ( !y ) {
        errMsg2 = "The recpient's email address is required.";              
        $("div#emptyEmail").html(errMsg2).show();
        error = true;
    }

    if (error === true) return false;

}​
于 2012-09-12T01:02:47.250 回答
0

对于想知道如何将两个函数合二为一的人，这是我为此创建的一个函数：

function combineFunctions() {
    var args = Array.prototype.slice.call(arguments, 0);
    return function() {
            for (var i = 0, len = args.length; i < len; i++) {
                if (typeof args[i] === "function") {
                    args[i].apply(this, arguments);
                }
            }
    };
}

然后结合到功能：

var myFunc = function() { console.log('1'); };
var myOtherFunc = function() { console.log('2'); };

var myCombinedFunc = combineFunctions(myFunc, myOtherFunc);
myCombinedFunc(); // outputs 1, then 2 to the console

注意：这仅适用于具有相同参数的函数——非常适合将函数添加到事件处理程序

于 2013-09-27T18:40:12.597 回答