案例1.用Ajax实现用户名的校验
用Ajax实现用户名的校验
java的验证类
public class UserDao {
public boolean checkUserName(String name) { //这里的name是网页上用户输入的用户名
Connection conn = JdbcUtil.getConnection(); //实现和和数据库的连接，这个方法这里没有写，只要知道这是用来连接数据库的
PreparedStatement ps = null;
ResultSet rs = null;
boolean flag = false;
String sql = "select * from ajaxuser where username=?";
try {
ps = conn.prepareStatement(sql);
ps.setString(1, name);
rs = ps.executeQuery();
if (rs.next()) { //如果数据库中有下一个，那就说明数据库中已经有相同的用户名了，那就返回true
flag = true;
}
} catch (SQLException e) {
e.printStackTrace();
}
return flag; //没有重名返回false
}
}
MyServlet类主要通过Ajax是得到网页上的用户名，在把用户名放入到上面的方法中，在把得到的结果返回到界面
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("text/xml;charset=UTF-8"); //采用XML输出
PrintWriter out =response.getWriter(); //同样是write写出
String username=request.getParameter("username"); //得到表单输入的用户名
UserDao dao=new UserDao();
boolean flag =dao.checkUserName(username); //把表单中输入的用户名和数据库中进行核对
StringBuilder sb =new StringBuilder(); //因为是输出为xml格式，所以要输出下面这种格式
//<response><a>0</a></response> <response><a>1</a></response>
sb.append("<response>");
sb.append("<a>");
if(flag){
sb.append("1"); //说明如果存在在自定义标签a中value值为1
}else{
sb.append("0"); //没有为0
}
sb.append("</a>");
sb.append("</response>");
String xml=sb.toString(); //完成拼接后转为String类型
out.write(xml); //再把这一整个xml格式输出
out.flush(); //立即执行
out.close();
}
Jsp界面是用来显示在客户端
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<html>
<script type="text/javascript">
var XMLHttpReq; function createXMLHttpRequest() { //这是固定膜拜，因为浏览器有很多种所以判断，这个方法是得到XMLHttpRequest对象
if (window.XMLHttpRequest) { XMLHttpReq = new XMLHttpRequest();
} else if (window.ActiveXObject()) { try {
XMLHttpReq = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
XMLHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}
}
}
function back(){
alert(XMLHttpReq.readyState);
if(XMLHttpReq.readyState==4){ //判断对象状态是否完成
if(XMLHttpReq.status==200){
//这里相当于得到servlet输出的<response><a>0</a></response>这个标签
var xmlData=XMLHttpReq.responseXML;
var un=document.getElementById("un");
//得到a标签的第一个子标签，也就是文本标签的value值
var flag =xmlData.getElementsByTagName("a")[0].firstChild.nodeValue; //就是得到0或者1
if(flag==1){
un.innerHTML="该邮箱已被注册,请重新输入...."; //这就是span的作用了，用来回显
}else if(flag==0){
un.innerHTML="恭喜该邮箱可以使用..";
}} }}
function checkUserName(){
var username=document.getElementById("username").value; //得到客户端输入的name
var url="MyServlet?username="+username;
createXMLHttpRequest();
1 XMLHttpReq.onreadystatechange=back; //这里back可以没有括号也可以有，每当change改变一次都会调用back方法
XMLHttpReq.open("GET",url,true);
XMLHttpReq.send(null); //上面的back方法就已经执行了，其实是没有多大区别，这主要是readyState方法的特点，每一次值改变都会触发onreadystate change方法，放在上面和下面唯一区别就是放在下面back方法多执行一次，但也没有关系，因为back方法了只有一个判断，只有最后一次readyState=4时，
才为true，所以没有关系具体的自己理解
}
</script>
<body>
<form action="" > //这里可以不写因为上面url写了
用户名:<input type="text" name="username" id="username" onblur="checkUserName()"><span id ="un"></span><br/> //这里的span标签主要是用来回显 用的很机智
密码:<input type="password" name="password" ><br/>
<input type="submit" value="注册">
</form>
</body>
</html> 总结：这个以后应该会经常用到，没什么技术难点，自己多看多理解
案例1.用Ajax实现用户名的校验的更多相关文章
- SSH网上商城---使用ajax完成用户名是否存在异步校验
小伙伴在上网的时候,需要下载或者观看某些视频资料,更或者是在逛淘宝的时候,我们都需要注册一个用户,当我们填写好各种信息,点击确定的时候,提示用户名已经存在,小编就想,为什么当我们填写完用户名的时候,她 ...
- 使用ajax验证用户名重复
继上次的用户注册登录案例之后,对其中的部分功能再做进一步改进.上一版中用户提交表单后才对用户名进行校验,虽然做了回显,但还是感觉功能弱了些.为了能有更好用户体验,不是在用户提交表单后才给提示,而是在用 ...
- 11月10日上午ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库
1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...
- 利用jQuery实现的Ajax 验证用户名是否存在
异步刷新实现方式有多种,也可以借助JS的多种框架,下面是使用jQuery框架实现的AJAX 验证用户名是否存在 jQuery.ajax概述 HTTP 请求加载远程数据. 通过jQuery 底层 AJA ...
- asp.net ajax 检测用户名是否可用代码
原文 asp.net ajax 检测用户名是否可用代码 .net ajax 检测用户名是否可用代码 <script type="text/网页特效" src="c ...
- asp.net ajax检查用户名是否存在代码
原文 asp.net ajax检查用户名是否存在代码 用户注册时,我们经常需要检查用户名是否存在,本文就是实现无刷新验证用户名 打开开发环境VS 2005,新建项目(或打开现有项目),新建一个Web ...
- ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库
1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...
- Ajax检测用户名是否已经注册
程序功能 当用户名输入完成(即用户名输入框失去焦点),利用Ajax检测用户名是否已经注册! 实现过程 利用Ajax向CheckUserServlet发送请求,判断该用户名是否可用.这里只是为了演示Aj ...
- Ajax验证用户名是否被注册
Ajax验证用户名是否被注册 var xmlHttp; function createXMLHttpRequest(){ // 创建XMLHttp请求对象 if(window.ActiveXObjec ...
随机推荐
- (转载)html中table的使用方法
colspan表示该一储存格向右打通的栏数. rowspan表示该一储存格向下打通的栏数. colspan是表示横向合并单元格,colspan=“3”表示水平合并三个td rowspan是表示竖直 ...
- kali 安装ss代理客户端的方法（纯属个人总结）
1.声明版本,因为别的版本没测试过 2.下载客户端安装包 wget https://github.com/shadowsocks/shadowsocks/archive/master.zip 这个是代 ...
- airflow 部署
环境 : ubuntu 14.04 LTS python 2.7 script: 设置环境变量: export AIRFLOW_HOME=~/airflow 安装相关依赖包: sudo apt-get ...
- zepto返回顶部动画
点击返回顶部 function goTop(acceleration, time) { acceleration = acceleration || 0.1; time = time || 16; v ...
- 用ip来获得用户所在地区信息
淘宝api: package com.ebways.mq.utils; import com.alibaba.fastjson.JSON; import com.ebways.common.utils ...
- Swift3新特性汇总
之前 Apple 在 WWDC 上已将 Swift 3 整合进了 Xcode 8 beta 中,而本月苹果发布了 Swift 3 的正式版.这也是自 2015 年底Apple开源Swift之后,首个发 ...
- Winform Textbox控件字体垂直居中
项目中遇到要求Textbox内的字体垂直居中的问题,在网上找一直没有理想的解决方案.后来发现可以通过设置控件的字体来达到预期的效果. 默认的Textbox的Font属性为 “宋体, 9pt”,效果如下 ...
- redhat 配置本地yum源163yum源epel 源，无需卸载yum!无须拷贝ISO，愿网上少一点垃圾教程误人子弟
都知道redhat不收费,但是其yum服务是要收费的,不想出钱那就自己配置yum源就好了. 首先,博主之前也没用过redhat,第一次用yum装包的时候提示什么没注册之类的,balaba一大堆,然后就 ...
- UIStackView before iOS9.0
我用的Xcode8.1,同伴用的Xcode7.3.1,其上传了几个XIB文件,导致我这边项目一直爆红,爆红信息:"UIStackView before iOS9.0".如图: 网上 ...
- 【纯css】左图右文列表，左图外框宽度占一定百分比的正方形,右上下固定，右中自动响应高度。支持不规则图片。
查看演示 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF- ...