您的位置：首页 > Web前端 > JQuery

jQuery_ajax实现检查用户名是否已注册

2015-11-30 22:40 751 查看

<span style="font-size:18px;">@WebServlet("/RegisterServlet")
public class RegisterServlet extends HttpServlet {
private static final long serialVersionUID = 1L;

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request, response);
}

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();

String name = request.getParameter("username");

if(name.equals("admin")) {
out.print("<font color='red' size='-1'>该用户不可以用</font>");
} else {
out.print("<font color='green' size='-1'>该用户可用</font>");
}

out.flush();
out.close();
}

}</span>

<span style="font-size:18px;"><html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
$(function() {
/*$.ajax({
url:"请求服务器路径",
type:"POST"|"GET",
contentType:"text/json,html,xml;charset=utf-8", //可以传输的数据类型
dataType:"text","html","xml","json",
data:{name:"张三",age:"20"},
cache:true|false
success:// 成功处理的回调
function() {
// 成功处理的回调函数
},
error: // 失败处理的回调
function() {
// 失败处理的回调函数
}
});*/
})

function isExits(value) {
$.ajax({
type:"POST",
data:{username:encodeURI(value)},
url:"RegisterServlet",
dataType:"html",
complete:function() {
$("#loading").remove();
},
success:function(data) { // data 当前请求得到响应后的结果
console.log(data);
var $msg = $(data);
var $nextElement = $("[name='username']").next("font")
if($nextElement) {
$nextElement.remove();
}
$msg.insertAfter($("[name='username']"))
}

});
}
function aaa(value) {
$("#loading").attr("src","image/loading.gif");
setTimeout("isExits("+value+");",5000);
}
</script>
</head>
<body>
<img id="loading" /><br/>
<input type="text" name="username" onblur="aaa(this.value);"/>
</body>
</html></span>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航