移动端注册页面

最新推荐文章于 2023-02-20 21:33:13 发布
最新推荐文章于 2023-02-20 21:33:13 发布
阅读量422 收藏 1
点赞数 1
分类专栏： jq  js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/AnniceCui/article/details/80667846
版权

HTML：

<div class="mui-content">

<div class="mui-card">
                <div class="login_background">
                    <div class="part-top"></div>
                    <div class="part-content">
                        <div class="form">
         
                             <div class="group-input">
                                 <input type="text" name="telephone" id="telephone" placeholder="请输入您的手机号">
                             </div>
                             <div class="warning" id="reg-tele">
                              <p><i class="icon iconfont icon-wuuiconsuotanhao"></i>&nbsp;<span  id="telErrorMsg"></span></p>
                             </div>
         
                             <div class="group-input yzm">
                                 <input type="text" id="imgcode" name="txyzm" maxlength="4" placeholder="请输入图形验证码">
                                 <div class="tx-yzm">
                                  <img src="/userLogin/getImgCode" id="newImgCode">
                                 </div>
                             </div>
                            <div class="warning" id="reg-tx">
                            <p><i class="icon iconfont icon-wuuiconsuotanhao"></i>&nbsp;<span id="imgErrorMsg"></span></p>
                            </div>
         
                             <div class="group-input yzm">
                                 <input type="text" name="yzm" id="smsCode" maxlength="6" placeholder="请输入手机验证码">
                                 <div class="sz-yzm">
                                     <div class="gain" id="getCode">
                                      <input type="button" value="获取验证码" class="vercode fl" id="getCode1">
                                         <!--<p>获取验证码</p>-->
                                     </div>
                                 </div>
                             </div>
         
                             <div class="receive-masge">
                              <p>收不到短信？&nbsp;试试语音验证码吧！</p>
                              <p class='org' id='0952' style="display:none">请留意接听区号0952的来电（60s)</p>
                              <p><span id="useImmediately">立即使用&gt;</span></p>
                             </div>
                              <div class="warning" id="reg-sms">
                              <p><i class="icon iconfont icon-wuuiconsuotanhao"></i>&nbsp;<span id="phoneCodeMsg"></span></p>
                              </div>
                            <div class="group-input">
                                <input type="password" name="pwd" id="logPassword"  maxlength="16" placeholder="请输入登录密码（6-16位字母密码组合）" οnblur="validatePwd()" >
                            </div>
                            <div class="warning" id="reg-pwd">
                            <p><i class="icon iconfont icon-wuuiconsuotanhao"></i>&nbsp;<span id="pwdErrorMsg">错误提示</span></p>
                            </div>
         
                            <div class="group-input">
                                <input type="text" name="yqnum" placeholder="请输入邀请码">
                            </div>
                            <div class="warning"><p><i class="icon iconfont icon-wuuiconsuotanhao"></i>&nbsp;错误提示</p></div>
         
    <br style="clear: both;" />
                        </div>
                    </div>
                 </div>
</div>
</div>

CSS：

 

.mui-card{
    font-size: 14px;
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    border-radius: 2px;
    background-color: #f7f7f7;
    background-clip: padding-box;
    box-shadow: 0 1px 2px rgba(0,0,0,.3);
}
input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea{
    line-height: 21px;
    width: 100%;
    height: 47px !important;
    margin-bottom: 15px;
    padding: 10px 15px;
    -webkit-user-select: text;
    border:none!important;
    border-radius: 3px;
    outline: 0;
    background-color: #fff;
    -webkit-appearance: none;
}

a{
    text-decoration: none;}
input{
    width: 100%;
    height: 50px;
    background: transparent;
    border: none;

}
input::-webkit-input-placeholder { /* WebKit browsers */
    color: #999999;
    font-size: 14px;
    padding: 0 10px;
}
input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #999999;
    font-size: 14px;
    padding: 0 10px;
}
input::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #999999;
    font-size: 14px;
    padding: 0 10px;
}
input:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #999999;
    font-size: 14px;
    padding: 0 10px;
}

.login_background{
    width: 100%;
    height: auto;
    margin-right: auto;
    margin-left: auto;
    background: url("../images/login/login.png") 0 0 no-repeat;
    background-size: 100% 270px;
}
.part-top{
    height: 60px;
    width: 100%;
    margin-bottom: 10px;
    position: relative;
    display: flex;
    display: -webkit-flex;
    flex-direction: row;
    align-items:center;
    justify-content:space-around;
}
.part-top .go-back{
    width: 50px;
    height: 25px;
}
.part-top .go-back img {
    width: auto;
    height: 100%;
}
.part-top .title{
    color: #fff;
    font-size: 16px;
    line-height: 60px;
}
.wan-btn{
    width: 50px;
    height: 25px;
    background-color: #fff;
    border-radius: 5px;
    text-align: center;
}
.wan-btn span{
    line-height: 25px;
    font-size: 14px;
    color: #fb7841;
    font-weight:bold;
}
.part-content{
    width: 100%;
    height: auto;
}
.part-content .form{
    width: 90%;
    height: auto;
    background-color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    border-radius: 4px;
    /*padding-top: 15px;*/
    display: flex;
    display: -webkit-flex;
    align-items:center;
    flex-direction:column;
    margin-top: 10px;
}
/*.part-content .form div:first-child{
    margin-top: 15px;
}*/
.vercode{
	width: 100%!important;
	border-radius: 0px!important;
	color: #ff5c5c!important;
}
.part-content .form .group-input{
    width: 90%;
    height: 50px;
    margin-bottom: 10px;
    border: 1px solid #eee;
}
.part-content .form .yzm input{
    width: 65%;
}
.part-content .form .yzm>div{
    width: 34%;
    height: 100%;
    float: right;
    border-left: 1px solid #eee;
}
.part-content .form .yzm>div>img{
    width: 100%;
    height: 100%;
}

.part-content .form .yzm>div .gain{
    width: 100%;
    font-size: 14px;
    text-align: center;
    color: #ff6c50;
}
.part-content .form .warning{
    color: #ff5c5c;
    text-align: left;
    width: 90%;
    margin-bottom: 10px;
    display: none;
}
.part-content .form .warning p,.part-content .form .yzm>div .gain p{
    color: #ff5c5c !important;
}
.part-content .form .warning i{
    font-size: 12px;
}
.part-content .form .warning p{
    margin: 0;
    font-size: 12px;
}
.part-content .form .receive-masge{
    width: 90%;
    height: auto;
    text-align: right;
    margin-bottom: 10px;
    color: #666666;
}
.part-content .form .receive-masge p{
    font-size: 12px;
    margin: 0;
}
.part-content .form .receive-masge span{
    color: #6299ff;
}
.part-content .form .hint{
    width: 90%;
    height: 50px;
    font-size: 13px;
    margin-bottom: 10px;
    color: #666666;
}
.part-content .form .hint p{
    margin: 0;
}
.part-content .form .hint span{
    color: #6299ff;
}
.part-content .form .hint .safety{
    text-align: center;
    margin-top: 10px;
    color: #999999;
    font-size: 12px;
}
.part-content .form .hint .safety i{
    color: #92d99d;
}
body{
    background-color: #f7f7f7;
}
a{
    text-decoration: none;}
input{
    width: 100%;
    height: 50px;
    background: transparent;
    border: none;

}
input::-webkit-input-placeholder { /* WebKit browsers */
    color: #999999;
    font-size: 14px;
    padding: 0 10px;
}
input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #999999;
    font-size: 14px;
    padding: 0 10px;
}
input::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #999999;
    font-size: 14px;
    padding: 0 10px;
}
input:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #999999;
    font-size: 14px;
    padding: 0 10px;
}
.main-part{
    width: 100%;
    height: auto;
    margin-right: auto;
    margin-left: auto;
    background: url("../images/login/login.png") 0 0 no-repeat;
    background-size: 100% 270px;
}
.part-top{
    height: 60px;
    width: 100%;
    margin-bottom: 10px;
    position: relative;
    display: flex;
    display: -webkit-flex;
    flex-direction: row;
    align-items:center;
    justify-content:space-around;
}
.part-top .go-back{
    width: 50px;
    height: 25px;
}
.part-top .go-back img {
    width: auto;
    height: 100%;
}
.part-top .title p{
    color: #fff;
    font-size: 16px;
    line-height: 60px;
    margin: 0;
}
.part-top .wan-btn{
    width: 50px;
    height: 25px;
    background-color: #fff;
    border-radius: 3px;
    text-align: center;
}
.part-top .wan-btn span{
    line-height: 25px;
    font-size: 14px;
    color: #fb7841;
    font-weight:bold;
}
.part-content{
    width: 100%;
    height: auto;
}
.part-content .form{
    width: 90%;
    height: auto;
    background-color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    border-radius: 4px;
    /*padding-top: 15px;*/
    display: flex;
    display: -webkit-flex;
    align-items:center;
    flex-direction:column;
    margin-top: 10px;
    padding-top: 10px;
}
/*.part-content .form div:first-child{
    margin-top: 15px;
}*/
.part-content .form .group-input{
    width: 90%;
    height: 50px;
    margin-bottom: 10px;
    border: 1px solid #eee;
}
.part-content .form .yzm input{
    width: 65%;
}
.part-content .form .yzm>div{
    width: 34%;
    height: 100%;
    float: right;
    border-left: 1px solid #eee;
}
.part-content .form .yzm>div>img{
    width: 100%;
    height: 100%;
}

.part-content .form .yzm>div .gain{
    width: 100%;
    font-size: 14px;
    text-align: center;
    color: #ff6c50;
}


.part-content .form .warning {
    color: #ff5c5c;
    text-align: left;
    width: 90%;
    margin-bottom: 10px;
    display: none;
}
.part-content .form .warning i{
    font-size: 12px;
}
.part-content .form .warning p{
    margin: 0;
    font-size: 12px;
}
.part-content .form .receive-masge{
    width: 90%;
    height: auto;
    text-align: right;
    margin-bottom: 10px;
    color: #666666;
}
.part-content .form .receive-masge p{
    font-size: 12px;
    margin: 0;
}
.part-content .form .receive-masge span{
    color: #6299ff;
}
.part-content .form .hint{
    width: 90%;
    height: 50px;
    font-size: .8125rem;
    margin-bottom: 10px;
    color: #666666;
}
.part-content .form .hint p{
    margin: 0;
    font-size: .75rem;
    color: #333333;
}
.part-content .form .hint span{
    color: #6299ff;
}
.part-content .form .hint .safety{
    text-align: center;
    margin-top: 10px;
    color: #999999;
    font-size: .75rem;
}
.part-content .form .hint .safety i{
    color: #92d99d;
}

js：

 

<script type="text/javascript">

 

            var InterValObj;

        var count = 60;

       var curCount;

       var curCountVoice=60;

       var InterValObjVoice;

            

         function setRemainTime() {

           

         if (curCount == 0) {

         window.clearInterval(InterValObj);

         $("#getCode1").removeAttr("disabled");

         $("#getCode1").val("重发");

         }

         else {

         curCount--;

         $("#getCode1").val( curCount + "秒");

         }

         }

 

            function setRemainTimeVoice() {

                if (curCountVoice == 0) {

                    window.clearInterval(InterValObjVoice);

                    //隐藏 请留意接听尾号0952的来电（60S）

                    $("#0952").hide();

                    $("#useImmediately").text('再次接听 >');

                    $("#useImmediately").show();

                } else {

                    curCountVoice--;

                    $("#0952").text("请留意接听区号0952的来电(" + curCountVoice + "s)");

                }

            }

        

        /*手机号验证*/

            $("#telephone").blur(function () {

//              console.log(1);

                //            判断是否为空

                var telephone = $("#telephone").val();

                if (telephone == null || telephone == '') {

                    $("#telErrorMsg").html("请输入手机号");

                    jQuery("#reg-tele").css("display", "block");

                    return;

                }

 

                // 正则验证手机号

                var patrn = /^1[34578]\d{9}$/;

                if (!patrn.exec(telephone)) {

                    $("#telErrorMsg").html("请输入正确的手机号码");

                    $("#reg-tele").css("display", "block");

                    return;

                } else {

                    $("#telErrorMsg").html("");

                    $("#reg-tele").css("display", "none");

                }

 

                //   ajax请求验证

                var datas = "?userName=" + telephone;

                ezajax(getCheckUserName + datas, {}, 'GET', function (res, minid) {

                    //console.log(JSON.stringify(res));

                    if (res.code == 1) {

                        $("#telErrorMsg").html("");

                        $("#reg-tele").css("display", "none");

                    } else {

                        $("#telErrorMsg").html(res.message);

                        $("#reg-tele").css("display", "block");

                    }

                })

            })

       

       $("#telephone").keyup(function () {

                var telephone = $("#telephone").val();

                if (telephone.length >= 11) {

                    var ss = telephone.substring(0, 11);

                    $("#telephone").val(ss);

                }

            })

 

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

                $('#newImgCode').attr('src', '/userLogin/getImgCode?dateTag=' + new Date().getTime());

            })

 

            $("#imgcode").blur(function () {

                var imgcode = $("#imgcode").val();

                if (imgcode == null || imgcode == '') {

                    $("#imgErrorMsg").html("请输入图形验证码");

                    $("#reg-tx").css("display", "block");

                    return;

                } else if (imgcode.length != 4) {

                    $("#imgErrorMsg").html("验证码错误");

                    $("#reg-tx").css("display", "block");

                    return;

                } else {

 

                    var img_datas = "?imgCode=" + imgcode;

                    ezajax(getCheckImgCode + img_datas, {}, 'GET', function (res, minid) {

                        if (res.code == 1) {

                            $("#imgErrorMsg").html("");

                            $("#reg-tx").css("display", "none");

                        } else {

                            $("#imgErrorMsg").html(res.message);

                            $("#reg-tx").css("display", "block");

                        }

                    })

                }

            })

       

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

 

                var telephone = $("#telephone").val();

                var imgcode = $("#imgcode").val();

                if (telephone == null || telephone == '') {

                    $("#telErrorMsg").html("请输入手机号");

                    jQuery("#reg-tele").css("display", "block");

                    return;

                }

                if (imgcode == null || imgcode == '') {

                    $("#imgErrorMsg").html("请输入图形验证码");

                    $("#reg-tx").css("display", "block");

                    return;

                }

                if (imgcode.length < 4) {

                    $("#imgErrorMsg").html("图形验证码错误");

                    $("#reg-tx").css("display", "block");

                    return;

                }

                if ($("#imgErrorMsg").html() != null && $("#imgErrorMsg").html() != '') {

                    return;

                }

                if ($("#telErrorMsg").html() != null && $("#telErrorMsg").html() != '') {

                    return;

                }

                else{

                    var teldatas = "?mobile=" + telephone + "&business=register" + "&imgcode=" + imgcode;

                    ezajax(getSendSmsCode + teldatas, {}, 'GET', function (res, minid) {

                        if (res.code == 1) {

                            $('#getCode').attr("disabled", "true");

                            curCount = count;

                            $("#getCode1").val( curCount + "秒");

    InterValObj = window.setInterval(setRemainTime, 1000);

                            $("#phoneCodeMsg").html("");

                            $("#reg-sms").css("display", "none");

                        } else {

                            

                            $('#phoneCodeMsg').html(res.message);

                            $("#reg-sms").css("display", "block");                          

                            $('#getCode1').attr("disabled", "true");

                            curCount = count;

                            $("#getCode1").val( curCount + "秒");

    InterValObj = window.setInterval(setRemainTime, 1000);

 

    

                            //setRemainTime(60);

                            

                        }

                    })

                }

                

            })

    

       

       $("#useImmediately").click(function (res, minid) {

                var telephone = $("#telephone").val();

                var imgcode = $("#imgcode").val();

                if (telephone == null || telephone == '') {

                    $("#telErrorMsg").html("请输入手机号");

                    jQuery("#reg-tele").css("display", "block");

                    return;

                }

                if (imgcode == null || imgcode == '') {

                    $("#imgErrorMsg").html("请输入图形验证码");

                    $("#reg-tx").css("display", "block");

                    return;

                }

                if (imgcode.length < 4) {

                    $("#imgErrorMsg").html("图形验证码错误");

                    $("#reg-tx").css("display", "block");

                    return;

                }

                if ($("#imgErrorMsg").html() != null && $("#imgErrorMsg").html() != '') {

                    return;

                }

                if ($("#telErrorMsg").html() != null && $("#telErrorMsg").html() != '') {

                    return;

                }

                var datas = '?mobile='+ telephone + '&imgcode=' + imgcode + '&business=register';

                ezajax(getSendsmscodeVoice+datas, {}, "GET", function (res, minid) {

                    if(res.code == 1){

         $("#useImmediately").hide();

         $("#0952").text("请留意接听区号0952的来电("+curCountVoice + "s)");

         $("#0952").show();

         InterValObjVoice = window.setInterval(setRemainTimeVoice, 1000);

     }else{

         $("#phoneCodeMsg").html(res.message);

         $("#reg-sms").css("display","block");

     }

                })

            })

                

       

       $("#smsCode").blur(function () {

                var smsCode = $('#smsCode').val();

                var telephone = $('#telephone').val();

                var imgcode = $("#imgcode").val();

                if (smsCode == null || smsCode == "") {

                    $("#phoneCodeMsg").html("请输入短信验证码");

                    $("#reg-sms").css("display", "block");

                    return;

                } else if (smsCode.length < 6) {

                    $("#phoneCodeMsg").html("短信验证码有误");

                    $("#reg-sms").css("display", "block");

                    return;

                }else if (telephone == null || telephone == "") {

                    $("#telErrorMsg").html("请输入手机号");

                    jQuery("#reg-tele").css("display", "block");

                    return;

                }else {

                    var teldatas = "?telephone=" + telephone + "&business=register" + "&imgcode=" + imgcode + "&smsCode=" + smsCode;

                    ezajax(getCheckSmsCode + teldatas, {}, 'GET', function (res, minid) {

                        if (res.code == 1) {

                            $("#phoneCodeMsg").html("");

                            $("#reg-sms").css("display", "none");

                        } else {

                            $("#phoneCodeMsg").html("短信验证码有误");

                            $("#reg-sms").css("display", "block");

                        }

                        

                    })

                }

                

            })

       

 

            function validatePwd(){

                var logPassword = $('#logPassword').val();

  var patrn = /^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]{6,20})$/;

  //logPassword = $.trim(logPassword);

  if(logPassword == null || logPassword == ""){

    $("#pwdErrorMsg").html("请输入登录密码");

  jQuery("#reg-pwd").css("display","block");

  return false;

  }else if(logPassword.length<6 || logPassword.length > 16){

    $("#pwdErrorMsg").html("请输入6-16位字符");

    jQuery("#reg-pwd").css("display","block");

    return false;

  }else if(!patrn.exec(logPassword)){

    $("#pwdErrorMsg").html("密码必须为字母加数字组合");

    jQuery("#reg-pwd").css("display","block");

    return false;

  }else{

   $("#pwdErrorMsg").html("");

   jQuery("#reg-pwd").css("display","none");

   return true;

  }

            }

            

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

                var telephone = $('#telephone').val();

  var imgcode = $("#imgcode").val();

  var smsCode = $('#smsCode').val();

  var logPassword = $('#logPassword').val();

  if(telephone == null || telephone == ""){

    $("#telErrorMsg").html("请输入手机号");

  jQuery("#reg-tele").css("display","block");

  return ;

  }

  if(imgcode == null || imgcode == ''){

  $("#imgErrorMsg").html("请输入图形验证码");

  $("#reg-tx").css("display","block");

  return ;

  }

  if(smsCode == null || smsCode == ""){

    $("#phoneCodeMsg").html("请输入短信验证码");

    $("#reg-sms").css("display","block");

    return ;

  }

  if(!validatePwd()){

    return ;

  }

  showMask();

  sessionStorage.setItem('telephone',telephone);

//ajax跨域传值

  $.ajax({

                     type: "POST",

                     url: getDoRegister,

                     data: {"telephone":telephone,"imgcode":imgcode,"smsCode":smsCode,"logPassword":logPassword,"business":'register'},

                     dataType: "JSON",

                     success : function(res){

                            if(res.code != 1){

                 mui.alert(res.message, '信息提示', function() { });

               }else if(res.code == 1){

                 ezajax(getkeyPair,{},"GET",function(res,minid){

                     var key = RSAUtils.getKeyPair(res.data.exponent, '', res.data.modulus);

                     var password = RSAUtils.encryptedString(key, logPassword);                  

                     $.ajax({

                                     type: "POST",

                                     url: getdoLogin,

                                     data: {username:telephone, password:password},

                                     dataType: "JSON",

                                     success : function(res){   

                                        closeMask();

                                            if(res.code == 1){

                                 location.href='dredge.html';

                             }

                                            

                                        }

                                 });

                                          

                 })

                 

               }

                            

                        }

                 });

 

            })

</script>


AnniceCui
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
【HTML+CSS】高级、简约的移动端登录注册界面，HR看了直呼里面请
weixin_46107112的博客
10-18 3217
超简单的登录注册界面，HR看了直呼里面请，HTML+CSS实现！
小程序（三）移动端小程序申请+页面布局
weixin_38380811的博客
02-16 1100
小程序（三）小程序申请+登录页面
小程序（五）移动端实现注册登录
weixin_38380811的博客
02-17 485
小程序（五）移动端实现注册登录
vue后台系统(PC端)
m0_53912016的博客
04-27 738
后台系统 一般后台最常见的是增删改查的效果，用户权限的效果，登录注册的效果and so on 这里是基于vue开发的后台系统 登录注册 用户权限 增 删 改 查
Android安卓实战项目---登陆注册页面（源码在文末）
热门推荐
m0_63324772的博客
02-20 1万+
【代码】Android开发实战——登录注册页面。附源码
移动端【注册小页面】
珍妮的小罐君
12-27 967
先看下效果图哦： HTML代码如下： &lt;!DOCTYPEhtml&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;推荐好友注册&lt;/title&gt; &lt;meta name="viewport"
HTML-移动端APP注册登录页面模板
06-08
2. **注册页面**：注册页面允许新用户创建账户，通常需要用户提供邮箱、手机号码、用户名、密码等信息。设计时需考虑表单的布局，确保输入字段清晰易懂，同时提供错误提示，以帮助用户正确填写信息。 3. **登录页面...
HTML移动端APP注册登录页面模板
10-01
HTML移动端APP注册登录页面模板 HTML移动端APP注册登录页面模板 HTML移动端APP注册登录页面模板 HTML移动端APP注册登录页面模板 HTML移动端APP注册登录页面模板 HTML移动端APP注册登录页面模板 HTML移动端APP注册...
整套移动端h5页面源码
12-09
在IT行业中，移动端H5页面源码是构建移动互联网应用的一种常见方式，尤其在电商项目中广泛应用。H5，即HTML5，是超文本标记语言的第五次重大修订，为网页开发提供了更多功能和交互性。本套源码提供了一整套移动端的...
jQuery移动端注册登录页面模板.zip
05-25
这个“jQuery移动端注册登录页面模板”提供了一整套完整的解决方案，帮助开发者快速构建功能完善的移动界面。以下是这个模板中包含的关键知识点： 1. **jQuery库**：jQuery是一个广泛使用的JavaScript库，它简化了...
移动端HTML5登录注册精美界面
02-07
最近在开发一款app时，得到了多款app登录界面模板。 全是HTMl5页面，适合Web端和移动端，样式完全兼容。 省的大家再一一去找了，在这里分享给大家。
H5移动端很漂亮的注册界面
04-09
纯h5实现的简介漂亮的移动端注册界面，拿来即用，若有不妥之处，还请指正
HTML移动端APP注册登录页面模板.zip
05-24
HTML移动端APP注册登录页面模板，全套模板，包括首页、注册、登录、密码修改等多个手机WAP模板页面。
jquery mobile 完成登录、修改、注册界面设计
06-17
利用jquery mobile 完成登录、修改、注册界面设计，帮助完成期末大作业
简洁的手机移动端登录和注册页面html
07-13
注：无后台 简洁的手机移动端登录和注册页面html
移动端用户登录&注册案例
Sunday97的博客
08-15 3801
用的是TypeScript语言，主要是展示相关的思想逻辑，而不是语法。会说明注册和登录页面进行局部切换的逻辑、用账号密码登录的相关逻辑、用手机号和验证码登录的相关逻辑、获取验证码的相关逻辑，忘记密码的相关逻辑，最后点击登录的相关逻辑 一、注册和登录页面进行局部切换 效果图： 即点击验证码登录时会切换到验证码登录，可以看到登录密码输入框的信息变成验证码输入框的信息，思想： 将账号输入框写在一...
vue登录注册(移动端)
m0_53912016的博客
05-08 1650
登录注册 效果图 代码
案例练习-HTML+CSS(Less)实现简单的注册页面(web移动端静态页面)
qq_43358004的博客
04-24 1649
html+css移动端静态登陆页面，新手案例练习
用vue写一个移动端注册页面
最新发布
06-07
好的，以下是一个简单的移动端注册页面的Vue代码： ``` 注册 用户名 邮箱 密码 注册 export default { data() { return { username: '', email: '', password: '' } }, ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值