本文介绍了thinkphp5使用bootstrapvalidator进行异步验证邮箱的示例，分享给大家，具体如下：

js验证:

1. /** 
2.  * Created by HONGXIN on 2017-10-23. 
3.  */ 
4. $(function () { 
5.   $('form').bootstrapValidator({ 
6.   
7.     message: 'This value is not valid', 
8.     feedbackIcons: { 
9.       valid: 'glyphicon glyphicon-ok', 
10.       invalid: 'glyphicon glyphicon-remove', 
11.       validating: 'glyphicon glyphicon-refresh' 
12.     }, 
13.   
14.     live: 'disabled',//验证失败后，提交按钮仍然是可选状态 
15.   
16.     fields: { 
17.       email: { 
18.         message: '用户名验证失败',//默认 
19.         verbose: false, 
20.         validators: { 
21.           notEmpty: { 
22.             message: '邮箱不能为空' 
23.           }, 
24.           emailAddress: { 
25.             message: '邮箱地址格式有误' 
26.           }, 
27.           remote: { 
28.             url: '/ajax_email', 
29.             message:"此邮箱已经注册", 
30.             type: "post", 
31.             dataType: 'json', 
32.             data: { 
33.               //默认传递的就是输入框的值 
34.             }, 
35.             delay: 500,//延迟效果 
36.           }, 
37.         } 
38.       }, 
39.       password: { 
40.         validators: { 
41.           notEmpty: { 
42.             message: '邮箱地址不能为空' 
43.           }, 
44.           stringLength: { 
45.             min: 6, 
46.             max: 18, 
47.             message: '用户名长度必须在6到18位之间' 
48.           }, 
49.         }, 
50.       }, 
51.       password2: { 
52.         validators: { 
53.           notEmpty: { 
54.             message: '确认密码不能为空' 
55.           }, 
56.           identical: { 
57.             field: 'password', 
58.             message: '两次密码必须一致' 
59.           } 
60.         } 
61.       }, 
62.       username:{ 
63.         validators: { 
64.           notEmpty: { 
65.             message: '用户名不能为空' 
66.           }, 
67.           stringLength: { 
68.             min: 2, 
69.             max: 8, 
70.             message: '用户名长度必须在2到8位之间' 
71.           } 
72.         } 
73.       } 
74.   
75.     } 
76.   }); 
77. }); 

TP5处理:

1. public function ajax_email(){ 
2.   //该message可以为空，它替换JS验证的message属性 
3.   echo json_encode(['valid'=>false,'message'=>'<a href="http://www.111cn.net/zhuanti/yanzhengma/" class="anchor" target="_blank">验证码</a>不正确']); 
4.   
5. } 

js验证几个注意点:

verbose: false,代表js验证合法后再异步后台验证，这样减少服务器压力

data: {} ,默认传递的就是输入框的值，所以一般不用写该属性，或者为空即可

后台注意点:

注意不是return而是echo

返回json格式 {'valid':true[,'message':'验证成功']}

Tags: 示例 邮箱

分享到：