javascript实现用户名是否存在的实时提醒
2016-05-03 16:25
387 查看
1.register.jsp中用户名处要这样写:
<tr> <td>用户名:</td> <td> <input type="text" name="username" size="25" maxlength="25" id="userid" onblur="validate()"> <div id="usermsg"></div> </td> </tr>
2.在register.jsp的HTML标签<head></head>内写javascript:
<script type="text/javascript"> var req; function validate() { var idField = document.getElementById("userid"); var url = "validate.jsp?id=" + escape(idField.value); //alert(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) { //alert(req.responseText); var msg = req.responseXML.getElementsByTagName("msg")[0]; //alert(msg); setMsg(msg.childNodes[0].nodeValue); } } } function setMsg(msg) { //alert(msg); 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>
3.创建validate.jsp页面,写校验username是否在数据库中存在的判断:
<%@page import="com.shopping.User"%> <% response.setContentType("text/xml"); response.setHeader("Cache-Control", "no-store"); //HTTP1.1 response.setHeader("Pragma", "no-cache"); //HTTP1.0 response.setDateHeader("Expires", 0); //prevents catching at proxy server //System.out.println(request.getParameter("id")); String username = request.getParameter("id"); //System.out.println(username); boolean userExist = User.isUserExist(username); //System.out.println(userExist); if(userExist){ //check the database response.getWriter().write("<msg>invalid</msg>"); } else { response.getWriter().write("<msg>valid</msg>"); } %>
4. 第3步中的User.isUserExist(username)是链接数据库查询的java文件,是类User中的一个方法,具体如下:
public static boolean isUserExist(String username){ boolean userExist = false; Connection conn = null; Statement stmt = null; ResultSet rs = null; try { conn = DB.getConn(); stmt = DB.createStmt(conn); String sql = "select * from user where username = '" + username + "'"; rs = DB.executeQuery(stmt, sql); if(rs.next()){ userExist = true; return userExist; } else { return userExist; } } catch (SQLException e) { // TODO Auto-generated catch block e.printStackTrace(); }finally { // TODO: handle finally clause DB.close(rs); DB.close(stmt); DB.close(conn); } return userExist; }/// end
另,附上判断用户名和密码复杂程度的文件regcheckdata.js。
function checkdata() { var ssn=form.username.value.toLowerCase(); if (!checkUserName(ssn)) return false; //用户名检查 if( strlen(form.password.value)<6 || strlen(form.password.value)>16 ) { alert("\正确地登录密码长度为6-16位,仅可用英文、数字、特殊字符!") form.password.focus() return false; } if( strlen2(form.password.value) ) { alert("\您的密码中包含了非法字符,仅可用英文、数字、特殊字符!") form.password.focus() return false; } if( form.password.value == form.username.value ) { alert("\用户名和密码不能相同!") form.password.focus() return false; } if( form.password2.value =="" ) { alert("\请输入密码确认!") form.pwd2.focus() return false; } if( form.password2.value != form.password.value ) { alert("\两次密码输入不一致!") form.password.focus() return false; } //检查电话 if( form.phone.value =="" ) { alert("\请输入电话!") form.phone.focus() return false; } //检查地址 if( form.addr.value =="" ) { alert("\请输入送货地址!"); form.addr.focus(); return false; } return true; } function checkUserName(ssn){ if( ssn.length<3 || ssn.length>18 ) { alert("\请输入正确的用户名,用户名长度为3-18位!") form.username.focus() return false; } if (isWhiteWpace(ssn)){ alert("\请输入正确的用户名,用户名中不能包含空格!") form.username.focus() return false; } if (!isSsnString(ssn)){ alert("\ 对不起,您选择的用户名不正确或已被占用!用户名\n由a~z的英文字母(不区分大小写)、0~9的数字、点、减\n号或下划线组成,长度为3~18个字符,只能以数字或字母\n开头和结尾,例如:kyzy_001。") form.username.focus() return false; } return true; } function strlen(str){ var len; var i; len = 0; for (i=0;i<str.length;i++){ if (str.charCodeAt(i)>255) len+=2; else len++; } return len; } function strlen2(str){ var len; var i; len = 0; for (i=0;i<str.length;i++){ if (str.charCodeAt(i)>255) return true; } return false; } function isWhiteWpace (s) { var whitespace = " \t\n\r"; var i; for (i = 0; i < s.length; i++){ var c = s.charAt(i); if (whitespace.indexOf(c) >= 0) { return true; } } return false; } function isSsnString (ssn) { var re=/^[0-9a-z][\w-.]*[0-9a-z]$/i; if(re.test(ssn)) return true; else return false; } function checkssn(gotoURL) { var ssn=form.username.value.toLowerCase(); if (checkUserName(ssn)){ var open_url = gotoURL + "?username=" + ssn; window.open(open_url,'','status=0,directories=0,resizable=0,toolbar=0,location=0,scrollbars=0,width=322,height=200'); } }
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- Extjs4.0 最新最全视频教程
- Javascript中toFixed方法的改进
- JavaScript演示排序算法
- JSP/PHP基于Ajax的分页功能实现
- javascript实现10进制转为N进制数
- 5个常见可用性错误和解决方案
- 开发阶段Jetty运行Jsp报错且响应空白
- 最后一次说说闭包
- Ajax
- js数组实现图片轮播
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 对一个分号引发的错误研究
- 异步流程控制:7 行代码学会 co 模块