2023年6月21日发(作者：)
使⽤layui+thymeleaf前端表单验证废话不多，直接上代码html页⾯代码：
定义开关变量var flagAccount = false;var flagPwd = false;var flagEmail = false;var flagDepartment = false;$(function () { //获取标签元素 let $account = $('#account'); let $email = $('#email'); let $pwd = $('#pwd1'); let $pwd2 = $('#pwd2'); let $registerForm = $('#register-form'); //
校验⽤户账号，⽤户姓名系统允许重名，但是账号不允许重复 $(function () { $('#accountTS').html(''); }) $(function () { let accountVal = $(); $.ajax({ url:'/validate/register/validateAccount', type:'GET', async:true, data: { account:accountVal }, success:function(result) { if ( != 200) { $('#accountTS').html(); flagAccount = false; } else { flagAccount = true; } }, error:function(result) { $('#accountTS').html(); } }); }); //校验两次输⼊的密码是否⼀致 $(function () { $('#pwd2TS').html(''); }); $(function() { let pwdVal = $(); let pwd2Val = $(); if (pwdVal != pwd2Val){ $('#pwd2TS').html('密码不⼀致'); flagPwd = false; } else { flagPwd = true; } }); //邮箱校验 $(function () { $('#emailTS').html(''); }) $(function(){ //校验邮箱格式是否正确 let regExp = /^[a-z0-9][w.-]*@[a-z0-9-]+(.[a-z]{2,5}){1,2}$/i; let emailVal = $(); if(!(emailVal)) { $('#emailTS').html('邮箱格式错误'); flagEmail = false; } else { flagEmail = true; //校验邮箱是否已注册 $.ajax({ url:'/validate/register/validateEmail', type:'GET', data: { email:emailVal }, success:function(result){ if ( != 200) { $('#emailTS').html(); $('#emailTS').html(); flagEmail = false; } else { flagEmail = true; } }, error:function(result){ $('#emailTS').html(); } }) } }) //校验部门 $('select').change(function () { $('#departmentTS').html(''); }); $(function() { if(flagAccount && flagPwd && flagEmail && $('select').val() != '-1') { return true; } else { if (!flagAccount) { $('#accountTS').html('账号校验失败'); } if (!flagPwd) { $('#pwd2TS').html('密码校验失败'); } if (!flagEmail) { $('#emailTS').html('邮箱校验失败'); } if ($('select').val() == '-1') { $('#departmentTS').html('尚未选择部门'); } return false; let email=$() let name = $() $.ajax({ url:'/manage/registered/detectrepeat/sendemail', type:'GET', async:true, timeout:5000, data: { email:email, name: name }, success:function(data){//请求成功之后的返回结果 }, error:function(xhr,textStatus){//请求失败之后的返回错误信息 ('错误',seText); (xhr); (textStatus); } }) } })})
2023年6月21日发(作者：)
使⽤layui+thymeleaf前端表单验证废话不多，直接上代码html页⾯代码：
定义开关变量var flagAccount = false;var flagPwd = false;var flagEmail = false;var flagDepartment = false;$(function () { //获取标签元素 let $account = $('#account'); let $email = $('#email'); let $pwd = $('#pwd1'); let $pwd2 = $('#pwd2'); let $registerForm = $('#register-form'); //
校验⽤户账号，⽤户姓名系统允许重名，但是账号不允许重复 $(function () { $('#accountTS').html(''); }) $(function () { let accountVal = $(); $.ajax({ url:'/validate/register/validateAccount', type:'GET', async:true, data: { account:accountVal }, success:function(result) { if ( != 200) { $('#accountTS').html(); flagAccount = false; } else { flagAccount = true; } }, error:function(result) { $('#accountTS').html(); } }); }); //校验两次输⼊的密码是否⼀致 $(function () { $('#pwd2TS').html(''); }); $(function() { let pwdVal = $(); let pwd2Val = $(); if (pwdVal != pwd2Val){ $('#pwd2TS').html('密码不⼀致'); flagPwd = false; } else { flagPwd = true; } }); //邮箱校验 $(function () { $('#emailTS').html(''); }) $(function(){ //校验邮箱格式是否正确 let regExp = /^[a-z0-9][w.-]*@[a-z0-9-]+(.[a-z]{2,5}){1,2}$/i; let emailVal = $(); if(!(emailVal)) { $('#emailTS').html('邮箱格式错误'); flagEmail = false; } else { flagEmail = true; //校验邮箱是否已注册 $.ajax({ url:'/validate/register/validateEmail', type:'GET', data: { email:emailVal }, success:function(result){ if ( != 200) { $('#emailTS').html(); $('#emailTS').html(); flagEmail = false; } else { flagEmail = true; } }, error:function(result){ $('#emailTS').html(); } }) } }) //校验部门 $('select').change(function () { $('#departmentTS').html(''); }); $(function() { if(flagAccount && flagPwd && flagEmail && $('select').val() != '-1') { return true; } else { if (!flagAccount) { $('#accountTS').html('账号校验失败'); } if (!flagPwd) { $('#pwd2TS').html('密码校验失败'); } if (!flagEmail) { $('#emailTS').html('邮箱校验失败'); } if ($('select').val() == '-1') { $('#departmentTS').html('尚未选择部门'); } return false; let email=$() let name = $() $.ajax({ url:'/manage/registered/detectrepeat/sendemail', type:'GET', async:true, timeout:5000, data: { email:email, name: name }, success:function(data){//请求成功之后的返回结果 }, error:function(xhr,textStatus){//请求失败之后的返回错误信息 ('错误',seText); (xhr); (textStatus); } }) } })})
发布评论