javascript - 条件 javascript 输入字段验证

Question

我目前正在做一个项目，要求我对包含条件输入字段的表单进行 javascript 表单验证(访问者可以选择是通过用户号还是电子邮件地址登录)。两个输入字段都是独立的，我需要执行以下操作:

如果访问者选择通过选项 A(用户编号)登录，则验证应仅考虑输入字段 A(用户编号)的 ID，而不需要对其他字段(电子邮件地址)进行验证。

反之亦然，如果访问者选择选项 B。

我目前用于验证的代码:

function empty() {
var x;
x = document.getElementById("user_number").value;
if (x == "") {
    MsgBox('Your user number is required.', 'ERROR');
    return false;
}
var y;
y = document.getElementById("email").value;
if (y == "") {
    MsgBox('Your email address is required.', 'ERROR');
    return false;
}

}

以及表单触发事件:

<form method="POST" id="accordion-top-form" action="" onsubmit="return empty();">

我需要扩展当前脚本以检查在提交表单时是否填写了字段 A 或字段 B(然后自动禁用对其他字段的验证)。

我该怎么做？

Answer 1

您可以使用以下内容:

var forms = {
  user: 0,
  email: 1
};

function whichForm() {
  var userForm = document.getElementById("user_number").value;
  var emailForm = document.getElementById("email").value;

  if (userForm && emailForm) {
    //user wrote in both forms, something is wrong
  } else if (!userForm && !emailForm) {
    //user didn't fill in any form
  } else {
    return userForm ? forms.user : forms.email;
  }
}

function empty(form) {
  if (form === forms.user) {
    // check if the user number form is empty
    var userForm = document.getElementById("user_number").value;
    if(userForm.trim() === "") {
      // possibly do more validation
      // return true or false based on whether you want to submit
    }
  } else if (form === forms.email) {
    // check if the email form is empty
    var emailForm = document.getElementById("email").value;
    if(emailForm.trim() === "") {
       // possibly do more validation
      // return true or false based on whether you want to submit
    }
  } else {
    // something is wrong, invalid parameter,
    // handle here
    return false
  }
}

function validate() {
  return empty(whichForm());
}

并更改您的表单，使其内联调用 return validate() 或仅作为提交处理程序调用 validate。