From 02d433047e0e5857cbcbdbafd2bffbd906535eab Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=B8=B8=E4=B9=99=E9=BA=9F?= <3215017830@qq.com>
Date: Mon, 2 Dec 2024 07:39:46 +0800
Subject: [PATCH] k

---
 .../20241129.md"                              | 340 ++++++++++++++++++
 1 file changed, 340 insertions(+)
 create mode 100644 "\346\270\270\344\271\231\351\272\237/20241129.md"
diff --git "a/\346\270\270\344\271\231\351\272\237/20241129.md" "b/\346\270\270\344\271\231\351\272\237/20241129.md"
new file mode 100644
index 0000000..40af179
--- /dev/null
+++ "b/\346\270\270\344\271\231\351\272\237/20241129.md"
@@ -0,0 +1,340 @@
+```
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <title>小兔鲜儿 - 新鲜 惠民 快捷!</title>
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="renderer" content="webkit">
+    <link rel="shortcut icon" href="./favicon.ico">
+    <link rel="stylesheet" href="./css/common.css">
+    <link rel="stylesheet" href="./css/register.css">
+    <link rel="stylesheet" href="https://at.alicdn.com/t/font_2143783_iq6z4ey5vu.css">
+</head>
+
+<body>
+<!-- 项部导航 -->
+<div class="xtx_topnav">
+    <div class="wrapper">
+        <!-- 顶部导航 -->
+        <ul class="xtx_navs">
+            <li>
+                <a href="./login.html">请先登录</a>
+            </li>
+            <li>
+                <a href="./register.html">免费注册</a>
+            </li>
+            <li>
+                <a href="./center-order.html">我的订单</a>
+            </li>
+            <li>
+                <a href="./center.html">会员中心</a>
+            </li>
+            <li>
+                <a href="javascript:;">帮助中心</a>
+            </li>
+            <li>
+                <a href="javascript:;">在线客服</a>
+            </li>
+            <li>
+                <a href="javascript:;">
+                    <i class="mobile sprites"></i>
+                    手机版
+                </a>
+            </li>
+        </ul>
+    </div>
+</div>
+<!-- 头部 -->
+<div class="xtx_header">
+    <div class="wrapper">
+        <!-- 网站Logo -->
+        <h1 class="xtx_logo"><a href="/">小兔鲜儿</a></h1>
+        <!-- 主导航 -->
+        <div class="xtx_navs">
+            <ul class="clearfix">
+                <li>
+                    <a href="./index.html">首页</a>
+                </li>
+                <li>
+                    <a href="./category01.html">生鲜</a>
+                </li>
+                <li>
+                    <a href="./category01.html">美食</a>
+                </li>
+                <li>
+                    <a href="./category01.html">餐厨</a>
+                </li>
+                <li>
+                    <a href="./category01.html">电器</a>
+                </li>
+                <li>
+                    <a href="./category01.html">居家</a>
+                </li>
+                <li>
+                    <a href="./category01.html">洗护</a>
+                </li>
+                <li>
+                    <a href="./category01.html">孕婴</a>
+                </li>
+                <li>
+                    <a href="./category01.html">服装</a>
+                </li>
+            </ul>
+        </div>
+        <!-- 站内搜索 -->
+        <div class="xtx_search clearfix">
+            <!-- 购物车 -->
+            <a href="./cart-none.html" class="xtx_search_cart sprites">
+                <i>2</i>
+            </a>
+            <!-- 搜索框 -->
+            <div class="xtx_search_wrapper">
+                <input type="text" placeholder="搜一搜" onclick="location.href='./search.html'">
+            </div>
+        </div>
+    </div>
+</div>
+<div class="xtx-wrapper">
+    <div class="container">
+        <!-- 卡片 -->
+        <div class="xtx-card">
+            <h3>新用户注册</h3>
+            <form class="xtx-form">
+                <div data-prop="username" class="xtx-form-item">
+                    <span class="iconfont icon-zhanghao"></span>
+                    <input name="username" type="text" placeholder="设置用户名称">
+                    <span class="msg"></span>
+                </div>
+                <div data-prop="phone" class="xtx-form-item">
+                    <span class="iconfont icon-shouji"></span>
+                    <input name="phone" type="text" placeholder="输入手机号码  ">
+                    <span class="msg"></span>
+                </div>
+                <div data-prop="code" class="xtx-form-item">
+                    <span class="iconfont icon-zhibiaozhushibiaozhu"></span>
+                    <input name="code" type="text" placeholder="短信验证码">
+                    <span class="msg"></span>
+                    <a class="code" href="javascript:;">发送验证码</a>
+                </div>
+                <div data-prop="password" class="xtx-form-item">
+                    <span class="iconfont icon-suo"></span>
+                    <input name="password" type="password" placeholder="设置6至20位字母、数字和符号组合">
+                    <span class="msg"></span>
+                </div>
+                <div data-prop="confirm" class="xtx-form-item">
+                    <span class="iconfont icon-suo"></span>
+                    <input name="confirm" type="password" placeholder="请再次输入上面密码">
+                    <span class="msg"></span>
+                </div>
+                <div class="xtx-form-item pl50">
+                    <i class="iconfont icon-queren"></i>
+                    已阅读并同意<i>《用户服务协议》</i>
+                </div>
+                <div class="xtx-form-item">
+                    <button class="submit">下一步</button>
+                    <!-- <a class="submit" href="javascript:;">下一步</a> -->
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+<!-- 公共底部 -->
+<div class="xtx_footer clearfix">
+    <div class="wrapper">
+        <!-- 联系我们 -->
+        <div class="contact clearfix">
+            <dl>
+                <dt>客户服务</dt>
+                <dd class="chat">在线客服</dd>
+                <dd class="feedback">问题反馈</dd>
+            </dl>
+            <dl>
+                <dt>关注我们</dt>
+                <dd class="weixin">公众号</dd>
+                <dd class="weibo">微博</dd>
+            </dl>
+            <dl>
+                <dt>下载APP</dt>
+                <dd class="qrcode">
+                    <img src="./uploads/qrcode.jpg">
+                </dd>
+                <dd class="download">
+                    <span>扫描二维码</span>
+                    <span>立马下载APP</span>
+                    <a href="javascript:;">下载页面</a>
+                </dd>
+            </dl>
+            <dl>
+                <dt>服务热线</dt>
+                <dd class="hotline">
+                    400-0000-000
+                    <small>周一至周日 8:00-18:00</small>
+                </dd>
+            </dl>
+        </div>
+    </div>
+    <!-- 其它 -->
+    <div class="extra">
+        <div class="wrapper">
+            <!-- 口号 -->
+            <div class="slogan">
+                <a href="javascript:;" class="price">价格亲民</a>
+                <a href="javascript:;" class="express">物流快捷</a>
+                <a href="javascript:;" class="quality">品质新鲜</a>
+            </div>
+            <!-- 版权信息 -->
+            <div class="copyright">
+                <p>
+                    <a href="javascript:;">关于我们</a>
+                    <a href="javascript:;">帮助中心</a>
+                    <a href="javascript:;">售后服务</a>
+                    <a href="javascript:;">配送与验收</a>
+                    <a href="javascript:;">商务合作</a>
+                    <a href="javascript:;">搜索推荐</a>
+                    <a href="javascript:;">友情链接</a>
+                </p>
+                <p>CopyRight &copy; 小兔鲜儿</p>
+            </div>
+        </div>
+    </div>
+</div>
+<script>
+    const username = document.querySelector('[name="username"]')
+    const phone = document.querySelector('[name="phone"]')
+    const send = document.querySelector('.xtx-form-item .code')
+    const code = document.querySelector('[name="code"]')
+    const password = document.querySelector('[name="password"]')
+    const confirm = document.querySelector('[name="confirm"]')
+    const consent = document.querySelector('.xtx-form-item i')
+    const submit = document.querySelector('.submit')
+
+    //用户名
+    function setUsername() {
+        const str = username.value
+        const reg = /[0-9a-zA-Z-_]{6,16}/
+        if (reg.test(str)) {
+            username.nextElementSibling.innerText = ''
+            return true
+        } else {
+            username.nextElementSibling.innerText = '请输入6-16位用户名，只能包含数字大小写字母和-_字符'
+            return false
+        }
+    }
+
+    //手机号码
+    function setPhone() {
+        const str = phone.value
+        const reg = /1[3-9][0-9]{9}/
+        if (reg.test(str)) {
+            phone.nextElementSibling.innerText = ''
+            return true
+        } else {
+            phone.nextElementSibling.innerText = '请输入正确的手机号码'
+            return false
+        }
+    }
+
+    //填写验证码
+    function setCode() {
+        const str = code.value
+        const reg = /\d{6}/
+        if (reg.test(str)) {
+            code.nextElementSibling.innerText = ''
+            return true
+        } else {
+            code.nextElementSibling.innerText = '请输入正确的验证码'
+            return false
+        }
+    }
+
+    //设置密码
+    function setPassword() {
+        const str = password.value
+        const reg = /[0-9a-zA-Z-_]{6,20}/
+        if (reg.test(str)) {
+            password.nextElementSibling.innerText = ''
+            return true
+        } else {
+            password.nextElementSibling.innerText = '密码为6至20位大小写字母，数字和符号-_组成'
+            return false
+        }
+    }
+
+    //确认密码
+    function setConfirm() {
+        if (password.value === confirm.value && confirm.value !== '') {
+            confirm.nextElementSibling.innerText = ''
+            return true
+        } else {
+            confirm.nextElementSibling.innerText = '与上面密码不相同'
+            return false
+        }
+    }
+
+    username.addEventListener('change', setUsername)
+
+    phone.addEventListener('change', setPhone)
+
+    //发送验证码
+    send.addEventListener('click', function setSend() {
+        let i = 3
+        send.innerText = `重新发送(${i})`
+        send.removeEventListener('click', setSend)
+        const s = setInterval(function () {
+            if (i > 1) {
+                i--
+                send.innerText = `重新发送(${i})`
+            } else {
+                clearInterval(s)
+                send.innerText = `重新发送`
+                send.addEventListener('click', setSend)
+            }
+        }, 1000)
+    })
+
+    code.addEventListener('change', setCode)
+
+    password.addEventListener('change', setPassword)
+
+    confirm.addEventListener('change', setConfirm)
+
+    //同意协议
+    consent.addEventListener('click', function () {
+        consent.classList.toggle('icon-queren2')
+    })
+
+    //下一步
+    submit.addEventListener('click', function (e) {
+        if (!consent.classList.contains('icon-queren2')) {
+            e.preventDefault()
+            return alert('请同意用户服务协议')
+        }
+        if (!setUsername()) {
+            e.preventDefault()
+            return
+        }
+        if (!setPhone()) {
+            e.preventDefault()
+            return
+        }
+        if (!setCode()) {
+            e.preventDefault()
+            return
+        }
+        if (!setPassword()) {
+            e.preventDefault()
+            return
+        }
+        if (!setConfirm()) {
+            e.preventDefault()
+            return
+        }
+        alert('注册成功')
+    })
+</script>
+</body>
+
+</html>
+```
\ No newline at end of file
-- 
Gitee

