register.html 5.3 KB
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <link rel="stylesheet" href="__TMPL__/public/assets/css/swiper-3.4.2.min.css" />
    <link rel="stylesheet" href="__TMPL__/public/assets/css/base.css" />
    <link rel="stylesheet" href="__TMPL__/public/assets/css/index.css" />
    <link rel="stylesheet" href="__TMPL__/public/assets/css/mask.css">
    <title>注册</title>
</head>

<body class="index_tenth_bgimg">
    <include file="public@header"/>
    <!--彈出框-->
    <div class="mask">

    </div>
    <div class="index_tenth index_eleventh">
        <div class="index_theth_contant">
            <form action="">
                <div class="index_tenth_bg">
                    <div class="index_tenth_one">
                        账号注册
                    </div>
                    <div class="index_tenth_two index_eleventh_two">
                        <input required type="tel" placeholder="请输入手机号" id="mobile">
                        <input required type="password" placeholder="请输入密码" id="password">
                        <input type="text" required placeholder="请输入验证码" id="mobile_code">

                        <input type="button" onclick="sendCode(this)" value="获取验证码" class="index_tenth_verify" style="width:1.8rem;border-radius: 1.2rem;padding-left:0.1rem;margin-top:0;height:0.6rem;"/>
                        <!--<div class="index_tenth_verify">-->
                            <!--获取验证码-->
                        <!--</div>-->
                    </div>

                    <div class="index_tenth_three" id="login">
                        已有账号?
                        <span>
                         立即登录
                        </span>
                    </div>
                    <button type="button" class="index_tenth_four" id="zhuce" style="border:0;outline: none;">注册</button>
                    <!--<div class="index_tenth_four" id="zhece">-->
                        <!--注册-->
                    <!--</div>-->
                </div>
            </form>
        </div>
        <div class="index_tenth_bottom">
            <div class="index_tenth_bottom_contant">
                Copyright © 2004-2019 独角星球 版权所有
            </div>
        </div>
    </div>
</body>
<script src="__TMPL__/public/assets/js/base.js"></script>
<script src="__TMPL__/public/assets/js/jquery-2.1.0.js"></script>
<script src="__TMPL__/public/assets/js/swiper.min.js"></script>
<script src="__TMPL__/public/assets/js/public.js"></script>
<script>
    $(function(){
        //提交注册
        $('#zhuce').click(function () {
            var mobile_code = $.trim($('#mobile_code').val());
            var password = $.trim($('#password').val());
            var phone_number = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
            var mobile = $("#mobile").val();
            if (!phone_number.test(mobile)){
                mask("手机号格式有误");
                return false;
            }
            if(password == '') {
                mask("密码不能为空");
                return false;
            }
            if(mobile_code == '') {
                mask("验证码不能为空");
                return false;
            }
            $.ajax({
                type: 'POST',
                url: "/portal/login/registerCommit",
                data: {
                    'mobile': mobile,
                    'mobile_code': mobile_code,
                    'user_pass': password
                },
                dataType: 'json',
                success: function (data) {
                    if (data.code == 1) {
                        mask('注册成功!');
                        window.location.href = '/portal/login/login';
                    } else {
                        mask(data.msg);
                    }
                }
            });
        });
    });
    //注册发送验证码
    function sendCode(val){
        var phone_number = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
        var mobile = $("#mobile").val();
        if (!phone_number.test(mobile)){
            mask("手机号格式有误");
        }else {
            $.ajax({
                type: 'POST',
                url: "/portal/common/sendMobileCode",
                data: {
                    'mobile': mobile
                },
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    if (data.code == 1) {
                        var countdown = 60;
                        settime(val, countdown);
                        mask(data.msg);
                    } else {
                        mask(data.msg);
                    }
                }
            });
        }
    }
    //倒计时
    function settime(val,countdown) {
        if (countdown == 0) {
            val.removeAttribute("disabled");
            val.value="获取验证码";
            countdown = 60;
        } else {
            val.setAttribute("disabled", true);
            val.value= countdown +"s";
            countdown--;
            setTimeout(function() {
                settime(val,countdown)
            },1000)
        }
    }
</script>
</html>