实现结果:在login.jsp页面提交用户名和密码(可以验证是否为空),点击登录跳转到loginResult.jsp页面进行验证并显示结果
JSP + JDBC + MySQL
login.jsp
设计一个表单,内容为两个输入框,一个用来输入用户名,另一个用来输入密码,并有一个提交按钮
用JavaScript函数验证输入框是否都不为空
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript"> function $(id) { return document.getElementById(id); } function check() { var user = $("user").value; var pwd = $("pwd").value; $("userInfo").innerHTML=""; $("pwdInfo").innerHTML=""; if(user == "") { $("userInfo").innerHTML="用户名不能为空!"; $("user").focus(); return false; } if(pwd == "") { $("pwdInfo").innerHTML="密码不能为空!"; $("pwd").focus(); return false; } return true; } </script> <style type="text/css"> #userInfo{color:red;} #pwdInfo{color:red;} </style> <title>登录</title> </head> <body> <center> <form action="loginResult.jsp" method="post" onsubmit="return check()"> <br><br><br><br><br><br> <table> <tr><td>用户名:</td><td><input type="text" name="userName" id="user"><span id="userInfo" ></span></td></tr> <tr><td>密码:</td><td><input type="password" name="userPwd" id="pwd"><span id="pwdInfo"></span></td></tr> <tr><td></td><td><input type="submit" value="登 录"></td> </table> </form> </center> </body> </html>
课堂测试未按时完成原因:假期未合理分配时间在该科目上导致未按时完成实现预期。
希望通过该课上可以开发简单有趣的小程序(app)。预计每周在该课程上花费8h。(努力吧!)