检查空白输入的自定义功能

Question

尝试构建一个自定义函数来检查错误，然后显示错误。

目前整个流程是这样的：

$("#addRecordSubmit").on("click", function(e) {
  e.preventDefault();
  let errors = "";

  let addobj = {
    addReference: $("#addReference").val(),
    addAccount: $("#addAccount").val(),
    addDescription: $("#addDescription").val(),
    // some more items
  };

  if (addobj.addReference == "") {
    $("#addReferenceError").show();
    errors = errors + 1;
  }
  if (addobj.addAccount == "") {
    $("#addAccountError").show();
    errors = errors + 1;
  }
  if (addobj.addDescription == "") {
    $("#addDescriptionError").show();
    errors = errors + 1;
  }
  // some more if statements

  if (errors > 0) {
    return false;
  } else {
    // process submit
  }
});

所以可重用的函数会帮助我。

所以我开始在上面的点击函数之外构建一个可重用的函数。 目前看起来像这样：

function checkFormErrors(obj, errorMessage) {
  if(obj == "") {
    $(errorMessage).show();
    errors = errors + 1;
  }
  return errors;
}

然后在我的点击函数中，我调用 checkFormErrors 函数，如下所示：

checkFormErrors(addobj.addReference, "#addReferenceError");

提交表单后，我收到控制台错误：

ReferenceError: errors is not defined

我做错了什么，如何才能让这个功能正常工作？

*** 编辑***

所以我将点击时的“错误”传递到 checkFormErrors 函数中，如下所示：

$("#addRecordSubmit").on("click", function(e) {
  e.preventDefault();
  let errors = "";

  let addobj = {
    addReference: $("#addReference").val(),
    addAccount: $("#addAccount").val(),
    addDescription: $("#addDescription").val(),
    // some more items
  }

  checkFormErrors(addobj.addReference, "#addReferenceError", errors);

  if (errors > 0) {
    return false;
  } else {
    // process submit
  }
});

所以 checkFormErrors 函数现在看起来像这样：

function checkFormErrors(obj, errorMessage, errors) {
  if(obj == "") {
    $(errorMessage).show();
    errors = errors + 1;
  }
  return errors;
}

我不再收到“错误未定义”消息，但我没有将错误计数返回到单击函数中。

我该如何解决这个问题？

Answer 1

这里似乎发生了一些事情：

1. let

   创建一个块作用域变量，因此它只能在声明它的块内使用。您需要创建一个全局变量或将变量传递给

   checkFormErrors()

   。

2. checkFormErrors()

   返回错误计数，但您没有保存结果以在点击侦听器中使用。将

   errors

   更新为

   errors = checkFormErrors(...)

   ;