审查视图

public/demo/write_info.html 6.6 KB
xiaohu authored
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,maximum-scale=1, minimum-scale=1, user-scalable=no">
    <title>填写信息</title>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/Mdate.css">
    <link rel="stylesheet" href="css/style.css">
    <script src="js/date/iScroll.js"></script>
    <script src="js/date/Mdate.js"></script>
    <style>
        /*.box{overflow: hidden;  }*/
    </style>
</head>
<body style="background-color: #f6f6f6;">
<div class="box">
    <div class="write_info_box">
        <ul class="write_list_box">
            <li class="write_list">
                <b class="icon_tory">*</b>
                <div class="info_content">
                    <i>姓名:</i>
                    <input type="text" class="user_name"/>
                </div>
            </li>
            <li class="write_list">
                <b class="icon_tory">*</b>
                <div class="info_content">
                    <i>性别:</i>
                    <input type="hidden" value=""/>
                    <label class="choose_sex" data-sex="2">
                        <b></b>
                        <img src="image/women_off.png">
                    </label>
                    <label class="choose_sex sex_active" data-sex="1">
                        <b></b>
                        <img src="image/men_on.png">
                    </label>
                </div>
            </li>
            <li class="write_list" id="dateShowBtn">
                <b class="icon_tory">*</b>
                <div class="info_content">
                    <i>出生日期:</i>
                    <input type="text" class="user_birth" id="dateSelectorTwo" readonly="readonly"/>
                    <em></em>
                </div>
            </li>
            <li class="write_list">
                <b class="icon_tory">*</b>
                <div class="info_content">
                    <i>身份证:</i>
                    <input type="number" class=""/>
                </div>
            </li>
            <li class="write_list">
                <b class="icon_tory">*</b>
                <div class="info_content">
                    <i>手机号:</i>
                    <input type="tel" class=""/>
                </div>
            </li>
            <li class="write_list">
                <b class="icon_tory">*</b>
                <div class="info_content">
                    <i>验证码:</i>
                    <input type="number" class="user_code"/>
                    <u class="get_code">获取验证码</u>
                </div>
            </li>
        </ul>
        <div class="is_agree">
            <i class="btn_dui"></i>
            <b>我已阅读并同意<span class="show_ht">《驾考合同》</span></b>
        </div>
        <div class="btn_next"></div>
    </div>
    <!--合同-->
    <div class="hetong_box">
        <h1>驾考合同</h1>
        <p>
            简洁是网上市场的关键,所以描述业务时要把摘要控制在
            300字以内。然而,即使喜欢使用显着的文字量的企业所
            有者,也可以用一个放大的关键句来为缺乏注意力的访客
            提供快速外卖。“任何可以跳出文本、迅速展示页面的信
            息的方法都可以加分”保持信息简短也有利于搜索引擎优
            化,总部设在加州红木城的小企业营销和搜索引擎优化策略师Sonya.
        </p>
        <p>
            简洁是网上市场的关键,所以描述业务时要把摘要控制在
            300字以内。然而,即使喜欢使用显着的文字量的企业所
            有者,也可以用一个放大的关键句来为缺乏注意力的访客
            提供快速外卖。“任何可以跳出文本、迅速展示页面的信
            息的方法都可以加分”保持信息简短也有利于搜索引擎优
            化,总部设在加州红木城的小企业营销和搜索引擎优化策略师Sonya.
        </p>
        <!--<div class="agree_none"></div>-->
        <div class="btn_agree"></div>
    </div>

</div>


<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script>
    $('.user_name').focus();
    $('.choose_sex').click(function(){
        var data_sex=$(this).attr('data-sex');
        if(data_sex==1){
            $(this).children('img').attr('src','image/men_on.png')
                .parent().siblings().children('img').attr('src','image/women_off.png');
        }else{
            $(this).children('img').attr('src','image/women_on.png')
                .parent().siblings().children('img').attr('src','image/men_off.png');
        }
        $(this).addClass('sex_active').siblings().removeClass('sex_active');

    });
    new Mdate("dateShowBtn", {
        acceptId: "dateSelectorTwo",
        beginYear: "1930",
        format: "-"
    });
    $(function  () {
        //获取短信验证码
        var validCode=true;
        $(".get_code").click (function  () {
            var time=60;
            var code=$(this);
            if (validCode) {
                validCode=false;
                code.addClass("msgs1");
                var t=setInterval(function  () {
                    time--;
                    code.html(time+"秒");
                    if (time==0) {
                        clearInterval(t);
                        code.html("重新获取");
                        validCode=true;
                        code.removeClass("msgs1");
                    }
                },1000)
            }
        })
        //显示合同
        $('.show_ht').click(function(){
            $('.btn_agree').show();
            $('.hetong_box').css("top","0");
            $("title").html("驾考合同");
        });
        $('.btn_agree').click(function(){
            $('.btn_agree').hide();
            $('.hetong_box').css("top","-200%");
            $('.btn_dui').addClass('dui_active');
            $('.btn_next').addClass('next_active');
            $("title").html("同意签署");
        });
        $('.write_info_box').on("click",".next_active",function(){
           window.location.href="confirm_order.html";
        });
    });

</script>
</body>
</html>