Web应用中JavaScript验证与Servlet表单提交的协同工作

formSubmit.addEventListener("click", (e) => {     // ... 验证逻辑 ...     if (Rno == null || Rno == "" || Password.length < 7) {         alert("Please enter a Room No or your password is incorrect");         setTimeout(function () {             window.location.reload();         }, 5000);     }     e.preventDefault(); // 问题所在：无条件阻止了表单提交 })

public class LoginServlet extends HttpServlet {     // ...     protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {         // 实现了doPost方法     }     // 没有实现doGet方法 }

<script>     // 获取表单元素，而不是提交按钮     const loginForm = document.querySelector(".loginForm");       loginForm.addEventListener("submit", (e) => { // 监听表单的submit事件         const Rno = document.getElementById("Rno").value;         const Password = document.getElementById("pass").value;          if (Rno === null || Rno.trim() === "" || Password.length < 7) {             alert("请输入房间号，或密码长度不正确（至少7位）。");             // 仅在验证失败时阻止表单的默认提交行为             e.preventDefault();              // 移除不必要的页面重载，因为它会清除用户输入，影响用户体验             // setTimeout(function () { window.location.reload(); }, 5000);          }         // 如果验证通过，不调用 e.preventDefault()，表单将正常以POST方式提交到LoginServlet     }); </script>

import jakarta.servlet.ServletException; import jakarta.servlet.http.HttpServlet; import jakarta.servlet.http.HttpServletRequest; import jakarta.servlet.http.HttpServletResponse; import java.io.IOException; import java.io.PrintWriter; import java.sql.Connection; import java.sql.DriverManager; import java.sql.PreparedStatement; import java.sql.ResultSet; import java.sql.SQLException;  public class LoginServlet extends HttpServlet {     private static final long serialVersionUID = 1L;      // 建议在init方法中初始化数据库连接池或数据源，而不是在doPost中每次创建     // public void init() throws ServletException { ... }      protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {         // 设置响应内容类型和字符编码，避免中文乱码         response.setContentType("text/html;charset=UTF-8");          PrintWriter out = response.getWriter();         Connection con = null; // 声明在try块外，以便finally中关闭         PreparedStatement ps = null;         ResultSet rs = null;          try {             // 1. 加载数据库驱动             Class.forName("com.mysql.cj.jdbc.Driver");             // 2. 建立数据库连接             con = DriverManager.getConnection("jdbc:mysql://localhost:3306/student","root","root");              // 3. 获取并转换请求参数             String roomNoStr = request.getParameter("Roomno");             String password = request.getParameter("password");              // 参数空值检查（尽管前端已做，后端仍需再次验证，以防绕过前端）             if (roomNoStr == null || roomNoStr.trim().isEmpty() || password == null || password.trim().isEmpty()) {                 out.println("房间号或密码不能为空。");                 return; // 提前返回             }              int roomNo;             try {                 roomNo = Integer.parseInt(roomNoStr);             } catch (NumberFormatException e) {                 out.println("房间号格式不正确，请输入数字。");                 e.printStackTrace();                 return; // 提前返回             }              // 4. 使用PreparedStatement防止SQL注入             ps = con.prepareStatement("select roomNo, userName from login where roomNo=? and password=?");             ps.setInt(1, roomNo);             ps.setString(2, password);              // 5. 执行查询             rs = ps.executeQuery();              // 6. 处理查询结果             if(rs.next()) {                 // 登录成功                 int userRoom = rs.getInt("roomNo"); // 推荐使用列名获取                 String userName = rs.getString("userName"); // 推荐使用列名获取                 out.println("登录成功！房间号: " + userRoom + " 分配给 " + userName);                 // 实际应用中，登录成功后通常会进行重定向或转发到用户主页                 // request.getSession().setAttribute("loggedInUser", userName);                 // response.sendRedirect("welcome.jsp");              } else {                 // 登录失败                 out.println("登录失败！房间号或密码不正确。");             }         } catch (ClassNotFoundException e) {             out.println("数据库驱动加载失败，请检查配置。");             e.printStackTrace();         } catch (SQLException e) {             out.println("数据库操作异常，请稍后再试。");             e.printStackTrace();         } finally {             // 7. 关闭资源，避免资源泄露             try {                 if (rs != null) rs.close();                 if (ps != null) ps.close();                 if (con != null) con.close();             } catch (SQLException e) {                 e.printStackTrace();             }             if (out != null) out.close(); // 确保PrintWriter关闭         }     } }