第13章 jQuery中的Ajax操作-
时间：2018年1·0月10号 天气：晴
1. 编程1： $.post()实现用户注册（提示，用邮箱或手机,密码进行注册，邮箱或手机必须在表中唯一，如果重复，必须给用户提示。密码必须要进行非空和长度判断。）
实例
前端代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>$.post()</title>
</head>
<body>
<h3>用户登陆$.post()</h3>
<p>
<label for="email">邮箱：</label>
<input type="email" id="email">
</p>
<p>
<label for="password">密码：</label>
<input type="password" id="password" >
</p>
<p>
<button>登陆</button>
</p>
<script src="lib/jQuery.js"></script>
<script>
$('button').click(function () {
if ($('#email').val().length === 0){
$('#email').after('<span style="color: orangered">邮箱不能为空</span>').next().fadeOut(3000);
$('#email').focus();
return false;
}
if ($('#password').val().length === 0){
$('#password').after('<span style="color: orangered">密码不能为空</span>').next().fadeOut(3000);
$('#password').focus();
return false;
}
if ($('#password').val().length <6){
$('#password').after('<span style="color: orangered">密码不少于六位字符</span>').next().fadeOut(3000);
$('#password').focus();
return false;
}
$.post(
'inc/check.php',
{
email:$('#email').val(),
password:$('#password').val(),
},
function (data) {
// console.log(data);
if (data.status === 2){
$('#email')
.after('<span style="color: red"></span>')
.next()
.html(data.message)
.fadeOut(3000)
.focus();
$('#email').val("");
$('#password').val("");
return false;
}
if (data.status ===1){
$('button')
.after('<span style="color: coral"></span>')
.next()
.html(data.message)
.fadeOut(3000);
return false;
}else{
$('button')
.after('<span style="color: black"></span>')
.next()
.html(data.message)
.fadeOut(3000);
return false
}
},
//响应数据类型
'json'
);
});
</script>
</body>
</html>后端代码：
本机运行图：
