核心提示：在H5表单中添加了需要新特性，同时也添加了一个关于input的validity新对象，我们可以利用这个来进行一些简单判断，减少对服务器的请求HTML账号 : input type=text place...
在H5表单中添加了需要新特性，同时也添加了一个关于input的validity新对象，我们可以利用这个来进行一些简单判断，减少对服务器的请求
HTML
账号 : <input type="text" placeholder="请输入手机号码" reuqired pattern="^[0-9]{11}$" id="phone"/>
密码 : <input type="password" placeholder="请输入密码" reuqired id="password"/>
elem.validity.valueMissing 验证required 的input标签是否为空 elem.validity.patternMismatch 验证 pattern里面的正则表达式是否正确
JS
var phone = document.getElementById('phone');
var password = document.getElementById('password');
if(phone.validity.valueMissing)
{
alert("账号不能为空");
return;
} else if(phone.validity.patternMismatch)
{
alert("账号输入有误");
return;
}
if(password.validity.valueMissing)
{
alert("密码不能为空");
return;
}
然后下面再进AJAX请求判断是否登录成功,而后台就不需要判断手机、密码为空和手机号长度不对的请求情况
不但减少了对服务的请求，同时减少后台的代码量。虽然不多…..
