JavaScript注册验证问题

各位!！我正在用HTML/JavaScript构建表单验证。问题是，它的行为总是像字段被填充一样，并将文本框涂成蓝色

    var fName = document.getElementById('fName').value;
    fName = document.getElementById('fName').focus();
    var lName = document.getElementById('lName').value;

    function validation()
    {



//check empty fields

if (fName == "" || lName == "") 
{
    document.getElementById('fName').style.backgroundColor = "red";
    document.getElementById('lName').style.backgroundColor = "red";
}


else(fName != "" || lName != "")
{
    document.getElementById('fName').style.backgroundColor = "blue";
    document.getElementById('lName').style.backgroundColor = "blue";
}

return false;

}

---

问题是行：

fName=document.getElementById（'fName'）.focus（）
fName
被指定为
undefined
，因此您应该尝试以下操作：

var element = document.getElementById('fName'); 
var fName = element.value;
element.focus();

例如，当您触发事件或执行某些操作时，返回值为
undefined
so
fName！=“
是真的

例如：

还要检查是否应该将
else if（）
替换为
else（）
完整示例：
我建议您尝试以下方法：

fname
<input type="text" id="fName" onfocus="checkIfEmpty(event)">
lname
<input type="text" id="lName" onfocus="checkIfEmpty(event)">

<script>
    function checkIfEmpty(event) {
        if (event.relatedTarget != null) {
            if (event.relatedTarget.value.length == 0) {
                event.relatedTarget.style.backgroundColor = "red";
            } else event.relatedTarget.style.backgroundColor = "green";
        }
    }
</script>

fname
名字
函数checkIfEmpty（事件）{
if（event.relatedTarget！=null）{
if（event.relatedTarget.value.length==0）{
event.relatedTarget.style.backgroundColor=“红色”；
}else event.relatedTarget.style.backgroundColor=“绿色”；
}
}
问题似乎出在这个打字错误上--

如果

，您将错过

，因此
（fName！=“”| | lName！=“”）
只是一个表达式，您可以对其求值，然后立即在花括号内执行代码

它运行正常，因为您将大括号放在下一行（否则会抛出一个
SyntaxError
）

您需要将代码更改为

else if (fName !== "" || lName !== "") {
  // set the style
}

感谢您的快速回复！我试过你的方法，但现在什么也没发生。字段没有红色或蓝色。@HrNik我已经更新了响应。检查示例。
else(fName != "" || lName != "")
{
  // set the color to 'blue'
}

else if (fName !== "" || lName !== "") {
  // set the style
}