登录  /  注册
博主信息
博文 60
粉丝 0
评论 1
访问量 36328
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
用php来处理表单 --4月17日作业
威灵仙的博客
原创
655人浏览过


实例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="http://apps.bdimg.com/libs/layer/2.1/layer.js" type="text/javascript" charset="utf-8"></script>
    <title>玩家注册页面</title>
    <style type="text/css">
         {
           margin: 0;
           padding: 0;
       }
       body {
           background: url(https://gss1.bdstatic.com/5bVXsj_p_tVS5dKfpU_Y_D3/data/d2af0e8da1e046c3146ac412826653a2)no-repeat center top;

                }
        div.wrap{
            margin-top:370px;
        }
       div.container {
           width: 500px;
           min-height:500px;
           box-shadow: 3px 3px 1px #4C4C4C;
           background-color: rgba(29,34,44,0.3);
           border-radius:2% ;
           color: white;
           text-align: center;
           margin: 200px auto;
       }
       .container p {
           padding: 10px;
       }
       .container input,textarea {
           background-color: rgba(29,34,44,0.5);
           border: none;
           color: white;
           font-size: 1.1em;
       }
       #userID,#user,#email,#pwd1,#pwd2 {
           width: 420px;
           height: 30px;
       }
       a {
           text-decoration: none;
           color:deepskyblue;
           font-weight: bolder;
       }
       a:hover {
           color:darkblue;
       }
       textarea {
           resize: none;
       }
       #submit,#Wecharlogin,#QQlogin {
           width: 420px;
           height: 30px;
           background-color: deepskyblue;
           border-radius: 6px;
       }
       #QQlogin:hover,#submit:hover {
           background: skyblue;
           cursor: pointer;
           font-size: 1.2em;
       }
       #header {
           margin: 20px auto;
           padding-top:20px ;
       }
       #Wecharlogin {
           background: green;
       }
       #Wecharlogin:hover {
           cursor: pointer;
           font-size: 1.2em;
           background: greenyellow;
       }
    </style>
</head>
<body>
    <div class="wrap">
        <div class="container">
        <div id="header">
            <h1>创建账号</h1>

        </div>
        <div class="main">
            <form action="check.php" method="post">
                <p><input type="text" name="userID" id="userID" value=""placeholder="请输入身份证号码" autofocus="autofocus"  /></br></p>
                <p> <input type="text" name="user" id="user" value="" placeholder="用户姓名" /></br></p>
                <p><input type="email" name="email" id="email" value="" placeholder="请输入邮箱账号"/></br></p>
                <p><input type="password" name="pwd1" id="pwd1" value="" placeholder="请输入密码"/></br></p>
                <p><input type="password" name="pwd2" id="pwd2" value="" placeholder="请确认密码"/></br></p>

                <p><input type="checkbox" name="agreed" id="agreed" value="" checked="checked" /><label for="agreed">我同意该<a href="#">隐私政策</a>中的各项条款,点击注册即表示同意该政策</label></p>
                <p><input type="submit" value="提交注册"id="submit"/><br></p>
                <p><input type="button" id="Wecharlogin" value="微信登陆" /></p>
                <p><input type="button" id="QQlogin" value="QQ登陆" /></p>
                <p><textarea name="" rows="5" cols="60" placeholder="对我们网站的意见或者留言"></textarea></p>
            </form>
        </div>
    </div>
    </div>

</body>
<script type="text/javascript">
    $(function(){
        //  1.  验证身份证id
        //添加失去焦点事件
        $('#userID').blur(function(){

            var url ="check2.php?check=userID"
            var data = 'userID='+$('#userID').val()
            var success =function(res){
                console.log(res)
                switch (res.status){
                    case '0':
                        layer.msg(res.msg);
                        $('#userID').focus()
                        break;
                    case '1':
                        layer.msg(res.msg);
                        $('#userID').focus()
                        break;
                    case '2':
                        layer.msg(res.msg);

                        break;
                    case '3':
                        layer.msg(res.msg);
                        $('#userID').focus()
                        break;
                }
            }
            $.post(url,data,success,'json')

    })
    //2.验证用户名

        $('#user').blur(function(){
            if($('#userID').val().length==0||$('#userID').val().length!=18){

                return false
            }

            $.post("check2.php?check=user",'user='+$('#user').val(),function(res){
                console.log(res)
                switch (res.status){
                    case '1':
                        layer.msg(res.msg);
                        $('#user').focus()
                        break;
                    case '2':
                        layer.msg(res.msg);
                        $('#user')
                        break;
                    case '3':
                        layer.msg(res.msg);
                        $('#user').focus()
                        break;
                }
            }   ,'json')

        })
//3.验证邮箱
        $('#email').blur(function(){
            if($('#user').val().length==0||!isNaN($('#user').val())){

                return false
            }

            $.post("check2.php?check=email",'email='+$('#email').val(),function(res){
                console.log(res)
                switch (res.status){
                    case '1':
                        layer.msg(res.msg);
                        $('#email').focus()
                        break;
                    case '2':
                        layer.msg(res.msg);
                        $('#email')
                        break;
                    case '3':
                        layer.msg(res.msg);
                        $('#email').focus()
                        break;
                    case '4':
                        layer.msg(res.msg);
                        $('#email').focus()
                        break;
                }
            }   ,'json')

        })
//4.验证密码
        $('#pwd1').blur(function(){
            if($('#email').val().length==0||!isNaN($('#email').val())){

                return false
            }

            $.post("check2.php?check=pwd1",'pwd1='+$('#pwd1').val(),function(res){
                console.log(res)
                switch (res.status){
                    case '1':
                        layer.msg(res.msg);
                        $('#pwd1').focus()
                        break;
                    case '2':
                        layer.msg(res.msg);
                        $('#pwd1')
                        break;
                    case '3':
                        layer.msg(res.msg);
                        $('#pwd1').focus()
                        break;
                    case '4':
                        layer.msg(res.msg);
                        $('#pwd1').focus()
                        break;
                }
            }   ,'json')

        })
//5.验证确认密码
        $('#pwd2').blur(function(){
            if($('#pwd1').val().length==0||!isNaN($('#pwd1').val())||$('#pwd1').val().length<8){

                return false
            }
            var url ="check2.php?check=pwd2"
            var data = {
                'pwd2':$('#pwd2').val(),
                'pwd1':$('#pwd1').val()
                }
            var success =function(res){
                console.log(res)
                switch (res.status){
                    case '0':
                        layer.msg(res.msg);
                        $('#pwd1').focus()
                        break;
                    case '1':
                        layer.msg(res.msg);
                        $('#pwd1').focus()
                        break;
                    case '2':
                        layer.msg(res.msg);

                        break;
                    case '3':
                        layer.msg(res.msg);
                        $('#pwd1').focus()
                        break;
                }
            }
            $.post(url,data,success,'json')
//6.验证复选框

    })

    })
</script>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

实例

<?php
// print_r($_POST['userID']);
//1.验证身份证号
    $userIDarr=[123456789123456789,987654321987654321,741852963741852963,963852741963852741,852963741123456789];
    $emailarr = ['abc@php.cn','admin@qq.com','ceshi@sina.cn'];
    switch ($_GET['check']) {
        case 'userID':
            $userid = $_POST['userID'];
            if(empty($userid)||strlen($userid)==0){
                echo json_encode(['status'=>'1','msg'=>'身份证号码不能为空']);
            } else if (strlen($userid)!==18) {
                 echo json_encode(['status'=>'0','msg'=>'请输入18位的身份证号码']);
            }else if(in_array($userid, $userIDarr)){
                echo json_encode(['status'=>'3','msg'=>'身份证号码已经注册,如果忘记密码请联系客服!']);
            }else{
                echo json_encode(['status'=>'2','msg'=>'身份证号码可以使用']);
            }
            break;
        case 'user':
            $user = $_POST['user'];
            if(empty($user)||strlen($user)==0){
                echo json_encode(['status'=>'1','msg'=>'姓名不能为空,请重新输入']);
            }else if(is_numeric($user)){
                echo json_encode(['status'=>'3','msg'=>'姓名验证错误,不能是数字,请重新输入']);
            }else{
                echo json_encode(['status'=>'2','msg'=>'恭喜你!!姓名验证通过,可以使用了']);
            }
            break;
        case 'email':
            $email = $_POST['email'];
            if(empty($email)||strlen($email)==0){
                echo json_encode(['status'=>'1','msg'=>'邮箱不能为空,请重新输入']);
            }else if(in_array($email, $emailarr)){
                echo json_encode(['status'=>'3','msg'=>'邮箱已经存在,如果忘记密码请联系客服!']);
            }else if(is_numeric($email)){
                echo json_encode(['status'=>'4','msg'=>'邮箱不能为数字,请重新输入']);
            }
            else{
                echo json_encode(['status'=>'2','msg'=>'恭喜你!!邮箱验证通过,可以使用']);
            }
            break;
        case 'pwd1':
            $pwd1 = $_POST['pwd1'];
            if(empty($pwd1)||strlen($pwd1)==0){
                echo json_encode(['status'=>'1','msg'=>'密码不能为空,请重新输入']);
            }else if(strlen($pwd1)<8){
                echo json_encode(['status'=>'4','msg'=>'密码不能少于8位']);
            }else if(is_numeric($pwd1)){
                echo json_encode(['status'=>'3','msg'=>'不能纯数字,请使用字母和密码组合!']);   }
            else{
                echo json_encode(['status'=>'2','msg'=>'恭喜你!!密码可以使用']);

            }
            break;
        case 'pwd2':
            $pwd1 = $_POST['pwd1'];
            $pwd2 = $_POST['pwd2'];
            if(empty($pwd2)||strlen($pwd2)==0){
                echo json_encode(['status'=>'1','msg'=>'密码不能为空']);
            } else if ($pwd1!==$pwd2) {
                 echo json_encode(['status'=>'0','msg'=>'两次密码不一致,请重新输入']);
            }else if(is_numeric($pwd2)){
                echo json_encode(['status'=>'3','msg'=>'密码不能纯数字,如果忘记密码请联系客服!']);
            }else{
                echo json_encode(['status'=>'2','msg'=>'密码一致,可以使用']);
            }
            break;
    }


?>

运行实例 »

点击 "运行实例" 按钮查看在线实例


批改状态:合格

老师批语:
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学