<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登录</title> </head> <body> <!--<form action="{:U('Exam/UserLogin')}" method="post">--> <table border="1"> <tr> <td>账号</td> <td><input type="text" name="username" id="username"><i id="user"></i></td> </tr> <tr> <td>密码</td> <td><input type="password" name="pwd" id="pwd"><i id="pw"></i></td> </tr> <tr> <td>验证码</td> <td> <input type="text" name="code" size="10px" id="code"> <span id="im"><img src="{:U('Exam/Yzm')}" width="120px" height="50px;" id="ym"></span> </td> </tr> <tr> <td></td> <td><input type="button" value="登录" id="sub"></td> </tr> </table> <!--</form>--> <script src="__PUBLIC__/jq/jquery.js"></script> <script> $(document).on('click','span',function(){ //图片的点击事件 $("#im").empty(); $("#im").append("<img src='{:U("Exam/Yzm")}' width='120px' height='50px;' id='ym'>"); }); $("#sub").click(function(){ //取值 var username = $("#username").val(); var pwd = $("#pwd").val(); var code = $("#code").val(); //判断 if(username.length==0){ $("#user").append("<font color='red'>账号不能为空</font>"); } if(pwd.length==0){ $("#pw").append("<font color='red'>密码不能为空</font>"); } if(pwd.length>6){ $("#pw").append("<font color='red'>密码长度不能超过6位数</font>"); } //请求 $.post("{:U('Exam/UserLogin')}", { username: username, pwd: pwd, code: code }, function(data){ if(data == 1){ alert('登录成功'); location.href="{:U('Index/show')}"; }else{ alert('登录失败'); history.go(0); } }); }); </script> </body> </html>
Jquery验证码刷新+表单验证+请求服务器
猜你喜欢
转载自www.cnblogs.com/hopelooking/p/9082206.html
今日推荐
周排行