mead
/
haoshengxin


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
							<?php
use yii\helpers\Url;
use yii\helpers\Html;
?>
<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <title>绑定手机</title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
    <?= Html::cssFile('@web/css/weui.min.css') ?>
    <?= Html::cssFile('@web/css/jquery-weui.min.css') ?>
    <?= Html::cssFile('@web/css/base.css') ?>
    <?= Html::cssFile('@web/iconfont/iconfont.css') ?>
</head>
<body>

<div class="tel-id login">
    <div class="img">
        <img src="../images/touxiang.jpg" alt="">
    </div>
    <form  method="post" action="<?=Url::toRoute(['site/updatepwd'])?>" id="myform">
        <ul class="id-info">
            <li>
                <label for="tel">手机</label>
                <input type="text" id="tel"  name="username" value="" placeholder="请输入手机号">
                <a href="javascript:;" id="getCode" class="open-box" >获取验证码</a>
            </li>
            <li>
                <label for="code">验证码</label>
                <input type="text" id="code" name="code" value="" placeholder="请输入验证码">
            </li>
            <li>
                <label for="pwd">密码</label>
                <input type="password" id="pwd" name="password" value="" placeholder="请输入密码">
            </li>
            <li>
                <label for="pwd">确认密码</label>
                <input type="password" id="pwd_again" name="password-again" value="" placeholder="请再次输入密码">
            </li>
        </ul>
        <a href="javascript:;" class="weui-btn weui-btn_plain-default signin">找回密码</a>
        <input type="hidden" name="_csrf-frontend" value="<?= Yii::$app->request->csrfToken ?>">
    </form>
</div>

<div class="code-box">
    <h2>请输入图片验证码</h2>
    <a href="javascript:;" class="close"><i class="iconfont icon-guanbi"></i></a>
    <div class="img">
        <img src="../code.php" id="createCheckCode"  alt="">
        <a onClick="updateImg()" href="javascript:;" class="refurbish"><i  class="iconfont icon-shuaxin"></i></a>
    </div>
    <div class="input">
        <input type="text"  class="now" id="first" maxlength="1"/>
        <input type="text"  class="now" id="two" maxlength="1"/>
        <input type="text"  class="now" id="three" maxlength="1"/>
        <input type="text"  class="now" id="last" maxlength="1"/>
    </div>

</div>
<div class="code-bg"></div>


<?= Html::jsFile('@web/js/jquery.min.js') ?>
<?= Html::jsFile('@web/js/jquery-weui.min.js') ?>
<script>
    //局部刷新验证码
    function updateImg(){
        $("#createCheckCode").attr("src", $("#createCheckCode").attr("src") +'?rnd='+ Math.random());
    }
    var lock = true;
    $('.signin').click(function(){
        var passreg = /^[a-zA-Z]\w{5,17}$/;
        var tel = $('#tel').val();
        var verifyCode = $('#code').val();
        var password = $('#pwd').val();
        var password_again = $('#pwd_again').val();
//       if(tel==''){
//            alert('手机号码不能为空');
//            return false;
//        }else if(!tel_reg.test(tel)){
//            alert('手机格式不正确');
//            return false;
//        }else if(verifyCode==''){
//            alert('请输入验证码');
//            return false;
//        }else if(password ==''){
//            alert('请设置密码');
//            return false;
//        }else if(!passreg.test(password)){
//            alert('请输入以字母为开头，只包含字符、数字和下划线，长度在6~18之间的密码');
//            return false;
//        }else if(password_again ==''){
//            alert('请再输一次密码');
//            return false;
//        }else if(password_again !=password){
//            alert('两次输入的密码不正确');
//            return false;
//        }
        if(lock){
            lock=false;
            $('#myform').submit();
        }
    })
    var tel_reg = /^1[34578]\d{9}$/;
    //验证码弹窗
    $('.tel-id .open-box').on('click',function () {
        var tel = $('#tel').val();
        if(!tel_reg.test(tel)){
            $.alert('手机号码格式不正确');
            return false;
        }
        $('.code-box').show();
        $('.code-bg').show();
        $('#first').focus();//获取第一个焦点
        $('.code-box .close').on('click',function () {//关闭按钮
            $('.code-box').hide();
            $('.code-bg').hide();
        });
    });
    //输入验证码
    $('.now').on('keyup',function(){
        if($(this).index()<4) {
            $(this).next('input').focus();
        }
    });
    //验证码输入完毕执行事件
    $('#last').on('keyup',function(){
        var one = $('#first').val();
        var two = $('#two').val();
        var three = $('#three').val();
        var four = $('#last').val();
        var tel = $('#tel').val();
        var code = one+two+three+four;
        $.ajax({
            url:"<?=Url::toRoute(['site/yzm']);?>",
            type:"POST",
            dataType:"JSON",
            data:{code:code,
                '_csrf-frontend':"<?= Yii::$app->request->csrfToken ?>"},
            success:function(data){
                if(data.sign=='0'){
                    $.alert(data.msg)
                }else if(data.sign=='1'){
                    $.ajax({
                        url: '<?=Url::toRoute(['site/sendcode1'])?>',
                        type: 'POST',
                        dataType:"json",
                        data: {tel:tel,type:'找回密码', '_csrf-frontend': '<?=Yii::$app->request->getCsrfToken();?>'},
                        success: function (data) {
                            if(data.sign==1){
                                $.alert(data.msg);
                                $('.code-box').hide();
                                $('.code-bg').hide();
                            }else{
                                $.alert(data.msg);
                            }
                        }
                    });
                }
            }
        });

    });
</script>
</body>
</html>