有条件的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

您可以测试是否都是空的

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 3

您可以使用下面的我个人不调用函数空：

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 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号码登录。从那以后，我认为最符合逻辑的就是找到其中一个输入所独有的东西，并根据您提供的输入中是否存在唯一元素的代码逻辑。

也因为电子邮件始终有@符号，验证它是否存在于提供的字符串中应该足以验证用户是否使用电子邮件或身份证号码尝试登录。

让我知道如果这有助于:)。