reset_password.html 12.5 KB
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>找回密码 - 美得得.万信达手店</title>
    <<include file="public/topmeta"/>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/bootstrap.min.css" media="screen"/>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/sigup.css" media="screen"/>
    <script type="text/javascript" src="__STATIC__/js/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="__PUBLIC__/static/js/layer/layer.js"></script>
    <script type="text/javascript" src="__STATIC__/js/com.js"></script>
</head>
<body style="background-color: #efefef">

<div style="background-color: #f7f7f7">
    <div style="background-color: white;border-bottom: 1px solid #e5e5e5;">
       <div class="container">
       <div id="header">
        <div>
            <a href="/" class="js-route"><div class="header-logo"></div> </a>
            <div class="header-title">找回密码 </div>
        </div>
    </div>
    </div>
    </Div>
    <div class="container" style="padding: 30px 0 30px 0" >
       <div id="main">
          <div class="clearfix"  style="">
            <div style="float: left;margin-left: 5%"><img src="__STATIC__/images/index/loginimg.jpg"></div>
            <div style="float: left; margin-left: 10%">
                <div class="content js-content">
                    <!--第一步-->
                    <form novalidate="" class="form-horizontal" style="" id="regform"  onkeydown="strdown1(event,this,'btnreg1')">
                    <!-- 禁止chrome自动填写 -->
                    <input style="display:none" type="text" name="fakeusernameremembered" />
                    <input style="display:none" type="password" name="fakepasswordremembered" />
                    <div class="control-group-container">
                        <div class="control-group ">
                            <label class="control-label">手机号码</label>
                            <div class="controls user-id multi">

                                <input type="text" class="js-mobile css-mobile" name="mobile" id="mobile" tabindex="1" placeholder="请输入手机号码" maxlength="11" autocomplete="off" />
                            </div>
                        </div>
                        <div class="err-msg"></div>
                    </div>
                        <div class="control-group-container">
                            <div class="control-group">
                                <label class="control-label">图片验证码</label>
                                <div class="controls">
                                    <div class="input-append" id="div_verify">
                                        <input type="text" tabindex="2" name="vertify" id="vertify"   value="" placeholder="图片验证验证码" class="vertify_input" maxlength="4"  onpropertychange="getyzcode()" style="width: 130px;"   />
                                        <img src='/Home/Api/regvertify' class="chicuele" id="imgVerify" alt="" onclick="fleshVerify()" width="110">
                                    </div>
                                </div>
                            </div>
                            <div class="err-msg"></div>
                        </div>
                    <div class="control-group-container">
                        <div class="control-group">
                            <label class="control-label">短信验证码</label>
                            <div class="controls">
                                <div class="input-append">
                                    <input class="input-half" tabindex="3" type="text" maxlength="6" name="sms_captcha" id="sms_captcha" placeholder="填写6位短信验证码" style="width: 120px;"/>
                                    <button type="button" class="btn js-fetch-sms btn-operation">获取验证码</button>
                                </div>
                            </div>
                        </div>
                        <div class="err-msg"></div>
                    </div>

                    <div class="control-group-container">
                        <div class="control-group">
                            <label class="control-label">设置新密码</label>
                            <div class="controls" style="position: relative;">
                                <input class="js-password-focus" tabindex="4" type="password" name="password" id="password" placeholder="8~20个字,包含字母和数字" maxlength="20" autocomplete="off" />
                                <span class="icon-switch-password icon-password-hide js-switch-password-display hide"></span>

                            </div>
                        </div>
                        <div class="err-msg"></div>
                    </div>

                    <div class="control-group">
                        <button type="button" tabindex="5" class="btn btn-block  btn-large btn-primary" data-loading-text="确认修改" id="btnreg1">确认修改</button>
                    </div>

                        <input type="hidden" value="" id="hidecodekey" name="hidecodekey" />
                </form>
                    <!--第三步--><!--注册成功-->
                    <div class="reg_success" style="display: none;margin-left: -40px;width: 100%;">
                        <div class="success_head">
                            <h3>恭喜您,密码重置完成!</h3>
                            <p>您已重置密码,请点击以下“立即登录”登录后台!</p>
                            <div class="control-group" style="width: 200px; padding-left: 30px;">
                                <button type="button" tabindex="12" class="btn btn-block btn-large btn-primary " data-loading-text="立即登录" id="btngo">立即登录</button>
                            </div>
                        </div>
                        <div class="success_head1">

                            <h3>温馨提示:</h3>
                            <p>
                                请保管好账号所有的资料,切勿忘记或透露他人。<br>
                                如有疑问,可咨询客服或者拨打400-087-9077全国服务电话。<br>
                                您现在可能需要:<a href="/"> 网站首页</a> | <a href="/admin/index/index.html"> 个人中心</a>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
       </div>
    </div>
</div>

<include file="public/footer"/>

</body>
</html>
<script>
    $(".storetype li").click(function(){
        $(".storetype li").each(function(){
            $(this).removeClass('active');
        });
        $(this).addClass('active');
    });

    function fleshVerify(){
        $('#imgVerify').attr('src','/index.php?m=Home&c=Api&a=regvertify&r='+Math.floor(Math.random()*100));//重载验证码
    }

    $("#btngo").click(function () {
        window.location.href='/Home/index/login.html';
    })

    $("#btnreg1").click(function () {


        if ($("#mobile").val()=="")
        {
            layer.msg('手机号码不能为空', {icon: 0, time: 1000});
            $("#mobile").focus();
            return false;
        }
        if (!checkMobile($("#mobile").val()))
        {
            layer.msg('手机号码格式有误,请核对', {icon: 0, time: 1000});
            $("#mobile").focus();
            return false;
        }
        if ($("#sms_captcha").val()=="")
        {
            layer.msg('请输入短信验证码', {icon: 0, time: 1000});
            $("#sms_captcha").focus();
            return false;
        }
        if ($("#sms_captcha").val().length!=6)
        {
            layer.msg('短信验证码位数不对,请输入六位短信验证码', {icon: 0, time: 1000});
            $("#sms_captcha").focus();
            return false;
        }

        if ($("#hidecodekey").val()=="") {
            layer.msg('图片验证码有误!', {icon: 0, time: 1000});
            return false;
        }
        if ($("#password").val()=="")
        {
            layer.msg('请输入密码', {icon: 0, time: 1000});
            $("#password").focus();
            return false;
        }
        if ($("#password").val().length<8 || $("#password").val().length>20)
        {
            layer.msg('密码限制8至20个字符 ', {icon: 0, time: 1000});
            $("#password").focus();
            return false;
        }
        var ai = layer.msg('提交中...', {icon: 16, shade: [0.5, '#f5f5f5'], scrollbar: false, offset: '200px', time: 0});

        $.ajax({
            type: "POST",
            url: "{:U('Index/resetpass')}",
            data: $('#regform').serialize(),// 你的formid
            error: function () {
                layer.close(ai);
                layer.msg('服务器繁忙, 请联系管理员', {icon: 0, time: 1000});

            },
            success: function (data) {
                layer.close(ai);
                if (data.code == 1) {
                    $("#regform").hide();
                    $(".reg_success").show();

                }
                else {
                    layer.msg(data.msg, {icon: 0, time: 1000});
                }
            }
        });

    })
    //
    $("#vertify").bind("input propertychange change",function(event){

        if ($("#mobile").val()=="")
        {
            layer.msg('手机号码不能为空', {icon: 0, time: 1000});
            $("#mobile").focus();
            $("#vertify").val("");
            return false;
        }
        if (!checkMobile($("#mobile").val()))
        {
            layer.msg('手机号码格式有误,请核对', {icon: 0, time: 1000});
            $("#mobile").focus();
            $("#vertify").val("");
            return false;
        }
        if ($("#vertify").val().length==4 && $("#hidecodekey").val()=="")
        {
            var getvertify=$("#vertify").val();
            var getvertify = getvertify.substr(0, 4);
            $.ajax({
                url: '/index.php?m=Home&c=Api&a=reg_smsm_verify&mobile=' + $("#mobile").val() + '&vertifycode=' + getvertify + '',
                type: 'post',
                dataType: 'json',
                success: function (res) {
                    if (res.status == 1) {
                        $("#hidecodekey").val(res.codekey);
                    }
                    else {
                        fleshVerify();
                        $("#vertify").val('');
                    }
                }
            })
        }
    });

    //发送验证码
    $('.btn-operation').click(function () {



        if ($("#mobile").val()=="")
        {
            layer.msg('手机号码不能为空', {icon: 0, time: 1000});
            $("#mobile").focus();
            return false;
        }
        if ($("#mobile").val().length!=11)
        {
            layer.msg('请输入11位手机号码', {icon: 0, time: 1000});
            $("#sms_captcha").focus();
            return false;
        }
        if ($("#vertify").val()=="" || $("#vertify").val().length!=4)
        {
            layer.msg('图片验证码不为空或位数不足4位', {icon: 0, time: 1000});
            $("#vertify").focus();
            return false;
        }
        if ($("#hidecodekey").val()=="") {
            layer.msg('图片验证码有误!', {icon: 0, time: 1000});
            return false;
        }
        var ai = layer.msg('发送中...', {icon: 16, shade: [0.5, '#f5f5f5'], scrollbar: false, offset: '200px', time: 0});

        $.ajax({
            type: "POST",
            url: "{:U('Index/reg_sms')}",
            data:'mobile='+$("#mobile").val()+"&vertify="+$("#vertify").val()+"&codekey="+$("#hidecodekey").val()+"&type=2",
            error: function () {
                layer.close(ai);
                layer.msg('服务器繁忙, 请联系管理员', {icon: 0, time: 1000});

            },
            success: function (data) {
                layer.close(ai);
                if (data.code == 1) {
                    countdown();
                }
                else {
                    layer.msg(data.msg, {icon: 0, time: 1000});
                }
            }
        });

    })
    var wait=60;
    function countdown() {

        var obj = $(".btn-operation");
        var msg="获取验证码";

        if (wait == 0) {
            obj.removeAttr("disabled");
            obj.text(msg);
            wait = "60";
        } else {
            obj.attr("disabled", "disabled");
            obj.text(wait + "秒后重新获取");
            wait--;
            setTimeout(function () {
                countdown()
            }, 1000)
        }
    }
</script>