JSP页面中JavaScript表单验证函数失效问题求助

看起来你的表单验证逻辑存在几个小疏漏，导致空字段无法阻止页面跳转，我来帮你梳理并修复：

问题分析 #

1. 提交事件的兼容性问题：你写的OnSubmit虽然HTML不区分大小写，但部分浏览器对事件属性的大小写敏感，建议使用标准小写onsubmit。
2. 冗余的条件判断：最后那个if(empt1 != "")完全多余——前面的if(empt1 == "")已经拦截了邮箱为空的情况，走到邮箱验证步骤时empt1必然非空，这个额外判断反而可能引发逻辑混乱。
3. 元素获取的可靠性：通过document.forms["form1"]["Iname"]获取元素有时会因表单上下文问题出错，改用getElementById更稳定（需要给输入框补充id属性）。

修复后的完整代码 #

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
</style>
<title>First Page</title>
<script language="javascript">
function required() {
    // 改用getElementById获取元素，避免表单上下文的潜在问题
    var nameVal = document.getElementById("Iname").value.trim(); // 过滤首尾空格
    var emailVal = document.getElementById("Iemail").value.trim();

    // 验证姓名非空
    if (nameVal === "") {
        alert("Please input a Value in name field");
        return false;
    }

    // 验证邮箱非空
    if (emailVal === "") {
        alert("Please input a Value in email field");
        return false;
    }

    // 验证邮箱格式
    var atpos = emailVal.indexOf("@");
    var dotpos = emailVal.lastIndexOf(".");
    if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= emailVal.length) {
        alert("Not a valid e-mail address");
        return false;
    }

    // 所有验证通过，允许提交
    return true;
}
</script>
</head>
<body>
<!-- 修正onsubmit为小写，给输入框添加id属性 -->
<form name="form1" action="Insert1" onsubmit="return required()" method="post">
    Name: <input type="text" name="Iname" id="Iname">
    <br/>
    Email: <input type="text" name="Iemail" id="Iemail">
    <br/><br/>
    <input type="submit" name="Submit" value="Insert User" />
</form>
<br>
<br/>
<br/>
</body>
</html>

额外优化说明 #

• 加入.trim()方法：可以过滤用户输入的首尾空格，避免只输入空格就通过验证的情况。
• 简化逻辑分支：去掉冗余判断，让代码更清晰，避免因分支遗漏导致的返回值异常。
• 统一变量命名：提升代码可读性，方便后续维护。

现在测试一下，当姓名或邮箱为空时，会弹出提示并阻止页面跳转；邮箱格式错误时也会拦截，只有所有验证通过才会提交到Insert1页面。

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