<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>Title</title>
<script src=”https://www.jb51.net/article/js/jquery-3.3.1.js”></script>
<script type=”application/javascript”>
$(function () {
//1: 给用户名输入框绑定失去焦点事件(onfocus onblur)
$(“#username”).on(“blur”,function () {
//获取用户名输入框数据
var username=$(“#username”).val();
//2:向服务器发出异步请求，让服务器去查询用户名是否存在
$.post(
“register”, //表示服务器的servlet路径
“username=”+username, //表示向服务器发送的数据
function (data) { // msg:用户名已经注册 code:0
if(data.code==0){
// alert(data.info);
$(“#spanId”).html(data.msg).css(“color”,”green”);
}else {
$(“#spanId”).html(data.msg).css(“color”,”red”);
}
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<title>Title</title>
<script src=”https://www.jb51.net/article/js/jquery-3.3.1.js”></script>
<script type=”application/javascript”>
$(function () {
//1: 给用户名输入框绑定失去焦点事件(onfocus onblur)
$(“#username”).on(“blur”,function () {
//获取用户名输入框数据
var username=$(“#username”).val();
//2:向服务器发出异步请求，让服务器去查询用户名是否存在
$.post(
“register”, //表示服务器的servlet路径
“username=”+username, //表示向服务器发送的数据
function (data) { // msg:用户名已经注册 code:0
if(data.code==0){
// alert(data.info);
$(“#spanId”).html(data.msg).css(“color”,”green”);
}else {
$(“#spanId”).html(data.msg).css(“color”,”red”);
}
},
“json”
);
});
});
</script>
</head>
<body>
<div>
<font>会员注册</font>USER REGISTER
<form class=”form-horizontal” style=”margin-top: 5px;”>
<table>
<tr>
<td>用户名</td>
<td>
<input type=”text” id=”username” name=”username” placeholder=”请输入用户名”>
<span id=”spanId”></span>
</td>
</tr>
<tr>
<td>密码</td>
<td>
<input type=”password” placeholder=”请输入密码”>
</td>
</tr>
</table>
<input type=”submit” value=”注册”/>
</form>
</div>
</body>
</html>
© 版权声明
文章版权归作者所有，未经允许请勿转载。
相关文章
