tp5 验证码点击刷新自动刷新

短命女 2023-05-22 22:35 27阅读 0赞

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <title>测试</title>  
    <link rel="stylesheet" href="style/login.css">  
    <script src="js/login.js"></script>  
</head>  
<body>  
    <div class="comp\_logo" style="font-size: 35px;text-align: center;margin-top: 40px;color: \#fff;">  
        管理中心  
    </div>  
    <div class="login\_out">  
        <div class="login">  
              
            <div class="imgs">  
                <img src="images/login.png" alt="">  
            </div>  
              
            <div class="form\_login">  
                <div class="loading" style="display: none;">  
                    <img src="images/loading.gif" style="width: 80%" alt="">  
                    <p>加载中……</p>  
                </div>  
                <form action="./">  
                    <div class="input"><input type="text" name="account" id='account' value="" placeholder="用户名"></div>  
                    <div class="input"><input type="password" name="password" id='password' value="" placeholder="密码"></div>  
                    <div class="code">  
                        <input type="text" name="code" id='code' placeholder="验证码">  
                        <span><img id="refresh"  οnclick="this.src='\{:captcha\_src()\}?'+Math.random()" src="\{:captcha\_src()\}" alt="captcha" /></span>  
                    </div>  
                    <div class="login\_btn">登录</div>  
                </form>  
            </div>  
        </div>  
    </div>

<script>  
    layui.use('layer', function()\{  
        var layer = layui.layer;  
        $('.login .login\_btn').click(function()\{  
            var code=$('\#code').val(),password=$('\#password').val(),account=$('\#account').val();  
            if(code=='')\{  
                layer.msg('验证码不能为空');  
                $('\#code').focus();  
            \}else if(account=='')\{  
                layer.msg('用户名不能为空');  
                $('\#account').focus();  
            \}else if(password=='')\{  
                layer.msg('密码不能为空');  
                $('\#password').focus();  
            \}else\{  
              
                $.ajax(\{  
                    url:"/index.php/shangjia/login/loginCheck",  
                    data:\{'account':account,'password':password,'code':code\},  
                    success:function(res)\{  
                        console.log(res);  
                        if(res.code==0)\{  
                            setTimeout(function()\{  
                                $('.loading').css('display','block');  
                                $('.login .form\_login form').css('transform','rotateX(90deg)');  
                                window.location.href='/index.php/shangjia';  
                            \},280)  
                        \}else\{  
                            layer.msg(res.msg,\{time:2000\},function()\{  
                                // location.reload();       
                                $('\#refresh').attr("src",'\{:captcha\_src()\}?'+Math.random());                                                   
                            \})  
                        \}  
                    \}  
                \})  
            \}  
        \})  
        $(document).keydown(function (event) \{  
            if(event.keyCode==13)\{  
               var code=$('\#code').val(),password=$('\#password').val(),account=$('\#account').val();  
                if(code=='')\{  
                    layer.msg('验证码不能为空');  
                    $('\#code').focus();  
                \}else if(account=='')\{  
                    layer.msg('用户名不能为空');  
                    $('\#account').focus();  
                \}else if(password=='')\{  
                    layer.msg('密码不能为空');  
                    $('\#password').focus();  
                \}else\{  
                  
                    $.ajax(\{  
                        url:"/index.php/shangjia/login/loginCheck",  
                        data:\{'account':account,'password':password,'code':code\},  
                        success:function(res)\{  
                            console.log(res);  
                            if(res.code==0)\{  
                                setTimeout(function()\{  
                                    $('.loading').css('display','block');  
                                    $('.login .form\_login form').css('transform','rotateX(90deg)');  
                                    window.location.href='/index.php/shangjia';  
                                \},280)  
                            \}else\{  
                                layer.msg(res.msg,\{time:2000\},function()\{  
                                    // location.reload();       
                                    $('\#refresh').attr("src",'\{:captcha\_src()\}?'+Math.random());                                                   
                                \})  
                            \}  
                        \}  
                    \})  
                \}  
            \}  
        \});  
    \})  
</script>  
</body>  
</html>

发表评论取消回复

表情：

评论列表（有 0 条评论，27人围观）

还没有评论，来说两句吧...

相关阅读

相关点击事件验证码不能实现刷新的问题

台验证码接口地址如下： $\{pageContext.request.contextPath\}/servlet/validateCodeServlet 当我们写了...

分手后的思念是犯贱/ 2024年04月17日 15:07/ 0 赞/ 136 阅读

相关 tp5 验证码点击刷新自动刷新

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>测试

短命女/ 2023年05月22日 22:35/ 0 赞/ 28 阅读

相关点击tabbar刷新页面

.h文件 import <UIKit/UIKit.h> @interface TabbarRootViewController : UITabBarCo

傷城~/ 2022年08月22日 13:26/ 0 赞/ 304 阅读

相关 SpringMVC验证码生成，点击刷新及验证--基于kaptcha

直接看结果实验结果 ![这里写图片描述][20160308153032876] 输入正确的验证码 ![这里写图片描述][20160308153044592] 输

川长思鸟来/ 2022年08月20日 06:10/ 0 赞/ 430 阅读

相关 Thinkphp5的captcha扩展包安装，验证码验证以及点击刷新

效果图 ![这里写图片描述][70] 一、首先使用Composer安装think-captcha扩展包，需要fanqiang哦 composer require

迷南。/ 2022年05月24日 05:48/ 1 赞/ 1230 阅读

相关 tp5验证码js快捷刷新

tp5验证码在config中配置 ![70][] js快捷刷新 <img οnclick="javascript:this.src=this.src+'?time

墨蓝/ 2022年05月20日 02:06/ 0 赞/ 227 阅读

相关 servlet生成验证码和点击刷新验证码

javaweb项目，有两个文件，一个java文件，用来生成验证码并输出到servlet输出流中。一个html文件，用来写组件和点击事件，刷新验证码。 CodeServlet.

- 日理万妓/ 2022年03月21日 06:46/ 0 赞/ 570 阅读

相关 tp5 验证码验证验证码刷新

首先使用`Composer`安装`think-captcha`扩展包： composer require topthink/think-captcha 在控制器中使

我会带着你远行/ 2022年02月23日 14:16/ 0 赞/ 454 阅读

相关 PHP 点击局部刷新

6.2.1在显示的验证码中img中添加一个id=“code” var code=document.getElementById(‘code’);

素颜马尾好姑娘i/ 2021年11月29日 11:48/ 0 赞/ 414 阅读

相关点击查询之后刷新boostraptable

//点击查询事件 $("\query").click(function() \{ //刷新列表 $('\table').bo

野性酷女/ 2021年11月05日 03:34/ 0 赞/ 303 阅读