继续上一篇,完成AJAX操作数据库的验证,有点儿水。
登录页面源码如下:
/*登录页面*/<%@ page language="java" pageEncoding="UTF-8"%> <html> <head> <title>用户登录</title> </head> <body> <form action="/BBS/JSP/Login/MyJsp.jsp" id="myform" method="post" > <table > <tr> <td>用户名</td> <td><input type="text" name="name" id="name" οnblur="checkUser(this.value);"/></td> <td><font color="red"><span id="spanName"></span></font></td> </tr> <tr> <td>密码</td> <td><input type="password" name="password" id="password" /></td> <td><font color="red"><span id="spanPassword"></span></font></td> </tr> <tr> <td colspan="2"> <input type="submit" value="登录"> </td> </tr> </table> </form> <script type="text/javascript"> /*xmlhttprequest对象*/ var xmlHttp; /*检查用户名是否存在*/ function checkUser(name) { /*先得到一个对象*/ xmlHttp = getXMLHttpObject(); if (xmlHttp == null) { alert("您的浏览器不支持ajax!!"); return false; } /*得到所输入的用户名*/ var name = document.getElementById("name").value; var url = "/BBS/JSP/Login/checkName.jsp?q=" + name;//设定请求的页面(服务器脚本),连带参数 xmlHttp.onreadystatechange=stateChanged;//设定验证的函数 /*发送请求*/ xmlHttp.open("GET", url, true); xmlHttp.send(null); } /*执行请求函数*/ function stateChanged() { if (xmlHttp.readyState==4) { /*请求结束后(readyState的状态为4代表请求结束),返回的内容写入id为spanName的span中*/ document.getElementById("spanName").innerHTML=xmlHttp.responseText; } } /*得到xmlhttprequest对象函数,通用 *这个函数为通用版本,依次检验各种流行浏览器,解决了兼容问题,*/ function getXMLHttpObject() { var xmlHttp = null; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; } </script> </body> </html>服务器脚本源码:(jsp页面实现的)
/*服务器脚本*/<%@ page language="java" pageEncoding="UTF-8"%> <%@ page import="java.sql.*" %> <%@ page import="com.db.*" %> <html> <head> <title>检测用户名是否存在</title> </head> <body> <% /*得到输入的用户名*/ String name = request.getParameter("q"); if (name == null) { name = "default"; } Connection con = TestPool.pool.getConnection();//这里是从自己写的数据库连接池里面直接拿出来的数据库连接,大家可以自己建立连接 Statement st = con.createStatement(ResultSet.CONCUR_UPDATABLE, ResultSet.TYPE_SCROLL_SENSITIVE); /*搜索用户名是否存在*/ ResultSet rs = st.executeQuery("select * from user where user_lgoinName = '" + name + "'"); rs.last(); int n = rs.getRow(); /*输出结果,会自动返回给登录验证页面。*/ if (n >= 1) { out.print("有"); } else { out.print("无"); } %> </body> </html> 总结:还是很水,大约只是能写出源来,要是bug了,肯定不会调试,因为还是理解的不深,不懂原理。留了两个疑问:服务器脚本用servlet实现?过滤器?