javascript - 表单验证和数组，如何收缩多个if和else语句？

我正在使用JavaScript验证注册表格。我决定添加红色文本样式以标识错误的输入。
我有两个数组：fail[]包含每个失败输入的消息，而lblcol[]具有不同的标签ID。

 var fail = new Array();

 fail[0] = validateNickname(form.form_nickname.value);
 fail[1] = validatePassword(form.form_password.value);
 fail[2] = validateFirstname(form.form_firstname.value);
 fail[3] = validateLastname(form.form_lastname.value);
 fail[4] = validateEmail(form.form_email.value);

var lblcol = document.querySelectorAll("#lbl0, #lbl1, #lbl2, #lbl3, #lbl4");

if (fail[0]!="")
lblcol[0].style.color="red";
else
lblcol[0].style.color="black";
if (fail[1]!="")
lblcol[1].style.color="red";
else
lblcol[1].style.color="black";
if (fail[2]!="")
lblcol[2].style.color="red";
else
lblcol[2].style.color="black";
if (fail[3]!="")
lblcol[3].style.color="red";
else
lblcol[3].style.color="black";
if (fail[4]!="")
lblcol[4].style.color="red";
else
lblcol[4].style.color="black";

有没有更快的方法来添加此效果？

最佳答案

您可以在一个简单的循环中执行此操作。该循环将遍历数组中的每个值，然后执行此测试。我也将if-else语句更改为ternary语句。代码如下所示：

for (var i=0;i<fail.length;i++) {
    lblcol[i].style.color = fail[i]!="" ? "red" : "black";
}

此循环将执行的操作是首先将变量i设置为0（通过代码var i=0;），然后测试是否i<fail.length，因为fail.length为5，所以对于前5次迭代，这都是正确的。然后，执行forloop的内容后，它会递增1（通过代码i++），并从测试i<fail.length的部分重新开始。

在循环内，它为索引lblcol的i分配颜色，并在数组"red"中索引i的值不等于空字符串时分配值fail，否则它分配值"black"。

关于javascript - 表单验证和数组，如何收缩多个if和else语句？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21372469/