邮箱验证函数异常：空输入时仅校验@符号问题排查

问题根源 #

你遇到的问题有两个原因：

1. 验证函数的条件判断顺序错误：当邮箱为空时，email.value.indexOf("@")结果是-1，会先触发“缺少@符号”的提示分支，完全不会走到空值判断的逻辑。
2. 表单提交事件写法有误：onsubmit里用了逗号运算符，这会直接忽略ValidateRadioButtons()的返回值，只以ValidateEmail()的结果决定是否提交，要是单选框验证不通过也拦不住提交。

修复步骤 #

1. 调整验证函数的判断顺序 #

把空值检测放在最前面，确保空字段优先被拦截：

function ValidateEmail() {
    var email = document.getElementById("email");
    // 先检查是否为空
    if (email.value.length === 0) {
        window.alert("请填写邮箱地址");
        email.focus();
        return false;
    } else if (email.value.length > 100) {
        window.alert("邮箱地址长度不能超过100个字符");
        email.focus();
        return false;
    } else if (email.value.indexOf("@") < 0) {
        window.alert("邮箱地址必须包含@符号");
        email.focus();
        return false;
    } else {
        return true;
    }
}

2. 修正表单的提交事件逻辑 #

用逻辑与&&连接两个验证函数，确保只有两个验证都通过时才提交表单：

<form method="post" action="" novalidate onsubmit="return ValidateRadioButtons() && ValidateEmail()">

额外小建议 #

• 邮箱输入框可以改成type="email"，浏览器会自带基础格式验证（你加了novalidate可以忽略这点）。
• 提示信息可以更通顺，比如把原英文直译的表述调整成符合中文用户习惯的话术。

内容的提问来源于stack exchange，提问作者Ndeer