條件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

聽起來這樣就夠了嗎？

我個人不會將函數調用為空，因為你想返回true以允許提交

function empty() {
  var x = document.getElementById("user_number").value,
      y = document.getElementById("email").value;
  x = x?x.trim()|| ""; // handle null and all blanks
  y = y?y.trim()|| "";

  if (x === "" && y === "") {
    alert("Please enter user number or email")
    return false;
  }
  // optional
  if (x && y) { // both entered
    alert("Please enter EITHER user number or email")
    return false;
  }

  if (x) return isValidUser(x); // each of these functions needs to return boolean
  if (y) return isValidEmail(y);

  // likely not going to happen
  return false;
}

Answer 2

您可以使用以下內容：

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 。

Answer 3

您可以測試兩者是否為空

function empty() {
  var a = document.getElementById("user_number").value,
      b = document.getElementById("email").value;
  if ("" == a && "" == b) return MsgBox("Your user number or mibile is required.", "ERROR"), !1
};

Answer 4

代碼以這種方式做到：

function empty() {
  var x = document.getElementById("user_number").value,
    y = document.getElementById("email").value;
  if (!x && !y) {
    alert('You should choose email address or number');
    return false;
  }
  return true;
}

Answer 5

建議的解決方案：檢查兩個輸入字段中的哪一個填滿：

var inputA = document.getElementById('A').value;
var inputB = document.getElementById('B').value;

if ((inputA !== "") || (inputA !== NaN) || (inputA !== undefined)) {
  //execute code for the user number
}
else if ((inputB !== "") || (inputB !== NaN) || (inputB !== undefined)) {
  //execute code for the email
}
else {
  //display an error saying none of the two fields were used
}

---

---

---

---

---

建議：大多數網站只使用1個輸入，因為它看起來更清潔。 占位符文本可以向用戶指定他應該輸入的輸入選項：

<input type="text" id="input1" placeholder="user number or email">

建議的解決方案：檢查用戶輸入是否具有@ symbole：

var input1 = document.getElementById("input1").value;
var emailInput = input1.includes('@');//returns a boolean with a value of true
                                     //if '@' was found in the string input1
if (emailInput) {
  //execute the code for the email input
} else {
  //execute the code for the userID input
} 

說明：

我假設你想在<form ...>標簽內使用相同的輸入字段，無論用戶是使用電子郵件還是id號登錄。從中我認為最合乎邏輯的是找到一些東西。這對於其中一個輸入是唯一的，並且根據所提供的輸入中是否存在該唯一元素來建立代碼的邏輯。

AKA，因為電子郵件始終具有@符號，驗證提供的字符串中是否存在該符號應該足以驗證用戶是否使用電子郵件或ID號來嘗試登錄。

如果有幫助，請告訴我:)。