下面将展示ajax中常用的几种
收藏
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>$.post()</title>
<script src="static/js/jquery-3.4.1.js"></script>
</head>
<body>
<h3>用户登录$.post()</h3>
<p><label for="email">邮箱:</label><input type="email" id="email" name="email"></p>
<p><label for="password">密码:</label><input type="password" id="password" name="password"></p>
<p><button id="submit">提交</button></p>
<script>
var email=$('#email');
var password=$('#password');
var btn=$('#submit');
btn.on('click',isEmpty);
function isEmpty(){
if (email.val().length === 0) {
email.after('<span style="color:red">邮箱不能为空</span>').next().fadeOut(2000);
email.focus();
return false;
} else if (password.val().length === 0) {
password.after('<span style="color:red">密码不能为空</span>').next().fadeOut(2000);
password.focus();
return false;
} else if (password.val().length < 6) {
password.after('<span style="color:red">密码不能少于6位</span>').next().fadeOut(2000);
password.focus();
return false;
} else {
checkUser1()
}
}
function checkUser() {
$.post(
'inc/check.php',
{
email:email.val(),
password:password.val()
},
function (data) {
if (data.status===1){
$('button')
.after('<span style="color: green"></span>')
.next()
.html(data.message)
.fadeOut(2000);
}else {
$('button')
.after('<span style="color: red"></span>')
.next()
.html(data.message)
.fadeOut(2000);
}
},
'json'
)
}
function checkUser1() {
$.ajax(
{
type:'POST',
url:'inc/check.php',
data:{
email: email.val(),
password: password.val()
},
success:function (data) {
if(data.status===1){
$('button')
.after('<span style="color: green"></span>')
.next()
.html(data.message)
.fadeOut(2000);
}else {
$('button')
.after('<span style="color: red"></span>')
.next()
.html(data.message)
.fadeOut(2000);
}
},
dataType:'json'
}
)
}
</script>
</body>
</html>点击 "运行实例" 按钮查看在线实例
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
