前端之家收集整理的这篇文章主要介绍了
Ajax使用范例,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
参考:http://wandering192.iteye.com/blog/736136 index.jsp: <%@ page pageEncoding="UTF-8" contentType="text/html;charset=utf-8"%> <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; request.setCharacterEncoding("utf-8"); %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> <
Meta http-equiv="pragma" content="no-cache"> <
Meta http-equiv="cache-control" content="no-cache"> <
Meta http-equiv="expires" content="0"> <
Meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <
Meta http-equiv="description" content="This is my page"> <script type="text/javascript"> var req; function valie() { var idField=document.getElementById("userid"); var url="validate.jsp?id="+idField.value; url=encodeURI(url); url=encodeURI(url) if(window.XMLHttpRequest){ req=new XMLHttpRequest(); }else if(window.ActiveXObject){ req=new ActiveXObject("Microsoft.XMLHTTP"); } req.open("GET",url,true); req.onreadystatechange=callback; req.send(null); } function callback() { if(req.readyState==4) if(req.status==200) { var msg=req.responseXML.getElementsByTagName("msg")[0]; setMsg(msg.childNodes[0].nodeValue); } } function setMsg(msg) { var mdiv=document.getElementById("usermsg"); if(msg=="invalid") { mdiv.innerHTML="<font color='red'>username exists!</font>"; } else { mdiv.innerHTML="<font color='green'>congratulations! you can use this username!</font>"; } } </script> </head> <body> <form action="user/login.action" method="post"> <table align="center"> <tr> <td align="center" colspan="2">图书管理系统登陆</td> </tr> <tr> <td>
用户名</td><td><input name="user.name" id="userid" type="text" onblur="valie()"/><span id="usermsg"></span></td> <!-- 因为valie()中 var idField=document.getElementById("userid")引用了id所以在这个input
标签需要
增加id
属性。 为了
显示验证结果,需要
添加<span id="usermsg"></span>。 --> </tr> <tr> <td>密码</td><td><input name="user.pwd" TYPE="PASSWORD"/></td> </tr> <tr> <td>
用户类型:</td> <td> <select name="user.type"> <option value="1">
管理员</option> <option value="2">普通
用户</option> </select> </td> </tr> <tr> <td colspan="2" align="center"><input type="submit" name="submit" value=" 登 陆 "> <input type="reset" name="reset" value=" 取 消 "></td> </tr> </table> </form> <div style="float:left; color:red" >${msg}</div> <br> <a href="user/get.action">查看</a> </body> </html> validate.jsp: <%@ page pageEncoding="UTF-8" contentType="text/html;charset=utf-8"%> <%@ page import="dao.*"%> <% response.setContentType("text/xml"); response.setHeader("Cache-Control","no-store"); response.setHeader("Pragma","no-cache"); response.setDateHeader("Expires",0); String name=(String)request.getParameter("id"); name = java.net.URLDecoder.decode(name,"UTF-8"); UserDao a=new UserDao(); if(a.exists(name)){ response.getWriter().write("<msg>invalid</msg>"); } else{ response.getWriter().write("<msg>valid</msg>"); } %> dao.UserDao: public boolean exists(String name){ Connection conn=null; PreparedStatement stat=null; ResultSet rst=null; String
sql="";
sql="select * from user where name='"+name+"'"; try { conn=DB.getConnection(); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); } try{ stat=conn.prepareStatement(
sql); rst=stat.executeQuery(); if(rst.next()){ return true; } }catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); } return false; }
原文链接:https://www.f2er.com/ajax/163726.html