使用ajax判断数据库是否存在已有用户名
2017-06-30 22:38
507 查看
在index.jsp输入：
<h2>案例一的实现</h2>
<a href="${pageContext.request.contextPath}/al/demo1.jsp">校验用户名</a>
在demo1输入：
<%@ 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">
<title>Inserttitle here</title>
<script src="${pageContext.request.contextPath}/al/jquery-1.11.0.js"></script>
<script type="text/javascript">
$(function(){
$("#username").blur(function(){
if($.trim($("#username").val())!=""){
//通过jq的ajax完成数据交互--文本框的内容不为""才去做ajax
var url = "${pageContext.request.contextPath}/al1";
var params = "username="+$("#username").val();
$.post(url,params,function(d){
if(d>0){
//不能用
$("#usename_msg").html("用户名已被占用").css("color","red");
//禁用按钮
$("#sub").prop("disabled",true);
}else{
//能用
$("#usename_msg").html("用户名可以使用").css("color","blue");
$("#sub").prop("disabled",false);
}
})
}
})
})
</script>
</head>
<body>
<form method="post" action="#">
<table>
<tr>
<td>用户名</td>
<td><input type="text"id="username" name="username" > </td>
<td><span id="usename_msg"></span></td>
</tr>
<tr>
<td>密码</td>
<td><input type="text" name="password" > </td>
<td></td>
</tr>
<tr>
<td colspan="3"><inputtype="submit" id=sub ></td>
</tr>
</table>
</form>
</body>
</html>
<h2>案例一的实现</h2>
<a href="${pageContext.request.contextPath}/al/demo1.jsp">校验用户名</a>
在demo1输入：
<%@ 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">
<title>Inserttitle here</title>
<script src="${pageContext.request.contextPath}/al/jquery-1.11.0.js"></script>
<script type="text/javascript">
$(function(){
$("#username").blur(function(){
if($.trim($("#username").val())!=""){
//通过jq的ajax完成数据交互--文本框的内容不为""才去做ajax
var url = "${pageContext.request.contextPath}/al1";
var params = "username="+$("#username").val();
$.post(url,params,function(d){
if(d>0){
//不能用
$("#usename_msg").html("用户名已被占用").css("color","red");
//禁用按钮
$("#sub").prop("disabled",true);
}else{
//能用
$("#usename_msg").html("用户名可以使用").css("color","blue");
$("#sub").prop("disabled",false);
}
})
}
})
})
</script>
</head>
<body>
<form method="post" action="#">
<table>
<tr>
<td>用户名</td>
<td><input type="text"id="username" name="username" > </td>
<td><span id="usename_msg"></span></td>
</tr>
<tr>
<td>密码</td>
<td><input type="text" name="password" > </td>
<td></td>
</tr>
<tr>
<td colspan="3"><inputtype="submit" id=sub ></td>
</tr>
</table>
</form>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- Ajax实现无刷新验证用户名是否存在 （使用AjaxPro.2.dll）(当鼠标离开输入框时，即使判断用户名是否存在)
- 使用Ajax动态判断用户名是否存在。
- 注册JQuery使用ajax调用后台方法，判断用户名、邮箱是否存在，并显示隐藏提示
- 使用Ajax判断用户名是否存在
- 注册JQuery使用ajax调用后台方法，判断用户名、邮箱是否存在，并显示隐藏提示
- 关于如何使用ajax异步判断用户名是否存在
- Ajax使用原生态JS验证用户名是否存在
- 利用ajax判断用户名是否存在
- [AJAX-JSP]使用DWR框架验证用户名是否存在
- SSH网上商城之使用ajax完成用户名是否存在异步校验
- 使用AJAX验证指定的用户名是否存在：
- 使用AJAX完成用户名是否存在异步校验:
- 使用Ajax实现用户名是否已经存在的验证
- AJAX 实现判断用户名是否存在 无刷新效果
- Ajax练习：使用jQuery验证用户名是否存在
- Ajax js 使用Ajax检测用户名是否存在
- 使用Ajax实时检测"用户名、邮箱等"是否已经存在
- 学习struts2建bbs总结五：使用jquery+ajax验证用户名是否存在以及struts效验信息不断重复的问题
- 使用servlet结合ajax验证数据库中是否存在某条记录
- 实现同步加载验证码和用户名是否存在的判断通过Ajax