验证邮箱的唯一性
- 获取文本框为其添加离开焦点事件
- 离开焦点时,检测用户输入的邮箱地址是否符合规则
- 不符合规则,阻止继续执行
- 向服务器发送请求,检测是否被别人注册
- 根据服务器返回提示信息
<input type="email" id="email">
<p id="info"></p>
<script>
var emailInfo=document.getElementById('eamil')
var info = document.getElementById('info');
eamilInfo.onblur=function(){
var eamil=this.value;
var reg=//;
if(!reg.test(eamil))
{
//给出用户提示
info.innerHTML='请输入正确的邮箱';
info.className = 'bg-danger';
return ;
}
//根据接口文档编写ajax
// 简要描述
// 请求地址
// 请求方式
// 参数
// 返回值
$.ajax({
type:'get',
url:'http://localhost:3000/verifyEmailAdress',
data:{
eamil:eamil
},
success:function(result){
console.log(result);
info.innerHTML=result;
info.className='bg-success';
},
error:function (result) {
console.log(result);
info.innerHTML=result;
info.className='bg-danger';
},
}),
}
</script>
<form action="/login" id="f1">
<input type="text" name="username">
<input type="password" name="password">
<button type="submit">提交</button>
</form>
<script>
$(function(){
//第一种方式
$('#f1').submit(function(){
alert("监听到了");
});
//第二种方式 表单绑定事件
$('#f1').on('submit',function(){
alert("监听到了");
});
//组织表单默认提交行为
$('#f1').submit(function (e) {
alert("监听到了");
e.preventDefault();//不会再跳转
});
$('#f1').on('submit', function (e) {
alert("监听到了");
e.preventDefault();
});
//快速获取表单数据 seriliable
// ajax发送请求前 获取表单数据
//form中输入框很多,要操作很多次dom
//使用serialize()函数,一次性获得表单所有数据,必须有name属性
//username=&password=
$('#f1').on('submit', function (e) {
var data= $('#f1').serialize();
});
})
</script>
<script>
$.get(url,[data],[callback])
//不带参数
$.get(url,function(res){
console.log(res);
})
//带参数
$.get(url,{id:1},function(res){
console.log(res);
})
</script>
牛逼
hh不是很全,只记了一点点