Question

我正在努力验证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";

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

Answer 1

您可以在一个简单的循环中完成此操作。循环将遍历数组中的每个值，然后执行此测试。我还将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，这对于前5次迭代，因为fail.length是5.然后执行forloop的内容，它递增1（通过代码i++），并从它测试的部分开始{{1} }。

在循环中，它为索引i<fail.length的{{1}}指定颜色，并在数组{lblcol处的值时指定值i 1}}不等于空字符串，否则分配值"red"。

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

1 个答案: