mead
/
haoshengxin


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
							<?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/logo.png" alt="">
    </div>
    <form  method="post" action="<?=Url::toRoute(['user/usertel','id'=>$id])?>" id="myform">
        <ul class="id-info">
            <li>
                <label for="tel">手机</label>
                <input type="text" id="tel" name="tel" value="" placeholder="请输入手机号">
            </li>
            <li>
                <label for="code">验证码</label>
                <input type="text" id="code" name="code" value="" placeholder="请输入验证码">
                <a href="javascript:;" id="getvarifyCode"data="false" class="open-box getvarifyCode" >获取验证码</a>
            </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">
        <?= \yii\captcha\Captcha::widget(['name'=>'captchaimg','captchaAction'=>'captcha','imageOptions'=>['id'=>'captchaimg', 'title'=>'换一个', 'alt'=>'换一个'],'template'=>'{image}']); ?>
<!--        <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" />
    </div>

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


<?= Html::jsFile('@web/js/jquery.min.js') ?>
<?= Html::jsFile('@web/js/jquery-weui.min.js') ?>
<?= Html::jsFile('@web/layer/layer.js') ?>
<script>
    //局部刷新验证码
    function updateImg(){
        //$("#createCheckCode").attr("src", $("#createCheckCode").attr("src") +'?rnd='+ Math.random());
        $('#captchaimg').click();
        $('.now').val('');
        $('#first').focus();
    }
    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==''){
           layer.msg("手机号码不能为空");
            return false;
        }else if(!tel_reg.test(tel)){
           layer.msg("手机格式不正确");
            return false;
        }else if(verifyCode==''){
           layer.msg("请输入验证码");
            return false;
        }
        if(lock){
            lock=false;
            $('#myform').submit();
        }
    })
    var tel_reg = /^1[34578]\d{9}$/;
    //验证码弹窗
   /* $('.tel-id .open-box').on('click',function () {
        if($('#getvarifyCode').attr("data")=='false'){
            var tel = $('#tel').val();
            if(!tel_reg.test(tel)){
                layer.msg("手机号码格式不正确");
                return false;
            }
            $('.code-box').show();
            $('.code-bg').show();
            $('#first').focus();//获取第一个焦点
            $('.code-box .close').on('click',function () {//关闭按钮
                $('.code-box').hide();
                $('.code-bg').hide();
            });
        }
    }); */

    $('#getvarifyCode').on('click',function(){
        if($(this).attr('data')!='false')
        {
            return false;
        }
        var tel = $('#tel').val();
        if(!tel_reg.test(tel)){
            layer.msg("手机号码格式不正确");
            return false;
        }
        $.ajax({
            url: '<?=Url::toRoute(['site/sendcode2'])?>',
            type: 'POST',
            dataType:"json",
            data: {tel:tel,type:'绑定手机号码', '_csrf-frontend': '<?=Yii::$app->request->getCsrfToken();?>'},
            success: function (data) {
                if(data.sign==1){
                    layer.msg(data.msg);
                    $('#getvarifyCode').removeClass('getvarifyCode');
                    setTime();
                }else{
                    layer.msg(data.msg);
                }
            }
        });
    });


    //验证码输入完毕执行事件
    $('#first').on('keyup',function(){
        var length = this.value.length;
        if( length == 4){
            var one = $('#first').val();
//            var two = $('#two').val();
//            var three = $('#three').val();
//            var four = $('#last').val();
            var tel = $('#tel').val();
            var code = one;
//            if(one!=''&&two!=''&&three!=''&&four!=''){
                if(one!=''){
                $.ajax({
                    url:"<?=Url::toRoute(['user/yzm']);?>",
                    type:"POST",
                    dataType:"JSON",
                    data:{code:code,
                        '_csrf-frontend':"<?= Yii::$app->request->csrfToken ?>"},
                    success:function(data){
                        if(data.sign==0){
                            layer.msg(data.msg);
                          //  updateImg();
                        }else if(data.sign==1){
                            $.ajax({
                                url: '<?=Url::toRoute(['site/sendcode2'])?>',
                                type: 'POST',
                                dataType:"json",
                                data: {tel:tel,type:'绑定手机号码', '_csrf-frontend': '<?=Yii::$app->request->getCsrfToken();?>'},
                                success: function (data) {
                                    if(data.sign==1){
                                        layer.msg(data.msg);
                                        $('#getvarifyCode').removeClass('getvarifyCode');
                                        setTime();
                                        $('.code-box').hide();
                                        $('.code-bg').hide();
                                    }else{
                                        layer.msg(data.msg);
                                    }
                                }
                            });
                        }
                    }
                });
            }
        }

    });
    var wait;
    function setTime(){
        wait = <?=\frontend\controllers\SiteController::$send_code_time?>;
        timer = setInterval("time()",1000);
        $('#getvarifyCode').css('background-color','#A1A1A1');
        $('#getvarifyCode').css('border','1px solid #A1A1A1');
        $('#getvarifyCode').attr("data", true);
    }
    function time(){
        if(wait>=0){
            msg="重新发送(" + wait + "s)";
            $('#getvarifyCode').text(msg);
            --wait;
            window.name=wait;
            $('#getvarifyCode').attr("data", true);
        } else{
            clearInterval(timer);
            $('#getvarifyCode').text('重新发送');
            $('#getvarifyCode').css('background-color','#ff9e1c');
            $('#getvarifyCode').addClass('getvarifyCode');
            $('#getvarifyCode').attr("data", false);
        }
    }
</script>
</body>
</html>