From 1da7e67887e4d114a83debe8b8bfc746c2231bad Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=88=B4=E4=BF=8A=E9=94=8B?=
 <95995809+zzzzzzz123000@users.noreply.github.com>
Date: Wed, 30 Nov 2022 21:36:12 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BD=9C=E4=B8=9A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../\344\275\234\344\270\232/2022.11.30.html" | 218 ++++++++++++++++++
 .../\347\254\224\350\256\260/2022.11.30.md"   |  59 +++++
 2 files changed, 277 insertions(+)
 create mode 100644 "25\346\210\264\344\277\212\351\224\213/\344\275\234\344\270\232/2022.11.30.html"
 create mode 100644 "25\346\210\264\344\277\212\351\224\213/\347\254\224\350\256\260/2022.11.30.md"
diff --git "a/25\346\210\264\344\277\212\351\224\213/\344\275\234\344\270\232/2022.11.30.html" "b/25\346\210\264\344\277\212\351\224\213/\344\275\234\344\270\232/2022.11.30.html"
new file mode 100644
index 0000000..eef9295
--- /dev/null
+++ "b/25\346\210\264\344\277\212\351\224\213/\344\275\234\344\270\232/2022.11.30.html"
@@ -0,0 +1,218 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<meta charset="UTF-8">
+		<title>注册表单验证</title>
+		<style type="text/css">
+			.errInfo{color: red; font-size: 12px;}
+			.errInfo img{ vertical-align:middle;}
+		</style>
+    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+	</head>
+	<body>
+		<form action="Demo12_01.html" >
+		<table width="1000" align="center">
+			<caption>用户注册</caption>
+			<tr>
+				<td width="300" align="right" height="30">用户名:</td>
+				<td width="700"><input type="text" id="txtAccount" >
+					<span id="spanAccount" class="errInfo"></span>
+				</td>
+			</tr>
+			<tr>
+				<td width="300" align="right" height="30">密码:</td>
+				<td width="700"><input type="password" id="txtPwd" >
+					<span id="spanPwd" class="errInfo"></span>
+				</td>
+			</tr>
+			<tr>
+				<td width="300" align="right" height="30">密码确认:</td>
+				<td width="700"><input type="password" id="txtPwdOk" ">
+					<span id="spanPwdOk" class="errInfo"></span>
+				</td>
+			</tr>
+			<tr>
+				<td width="300" align="right" height="30">性别:</td>
+				<td width="700">
+					<input type="radio" name="sex" id="rdBoy" value="男" >男
+					<input type="radio" name="sex" id="rdGirl" value="女" >女	
+					<span id="spanSex" class="errInfo"></span>
+				</td>
+			</tr>
+			<tr>
+				<td width="300" align="right" height="30">专业:</td>
+				<td width="700">
+					<select id="selProfessional" >
+						<option value="">--请选择--</option>
+						<option value="软件开发">软件开发</option>
+						<option value="电子商务">电子商务</option>
+						<option value="国际贸易">国际贸易</option>
+						<option value="工商管理">工商管理</option>
+						<option value="高级护理">高级护理</option>
+					</select>
+					<span id="spanProfessional" class="errInfo"></span>
+				</td>
+			</tr>			
+			<tr>
+				<td width="300" align="right" height="30">爱好:</td>
+				<td width="700" >
+					<input type="checkbox" name="hobby" value="抽烟" "/>抽烟
+					<input type="checkbox" name="hobby" value="喝酒" "/>喝酒
+					<input type="checkbox" name="hobby" value="打游戏" "/>打游戏
+					<input type="checkbox" name="hobby" value="烫头发" "/>烫头发
+					<input type="checkbox" name="hobby" value="足球" "/>足球
+					<input type="checkbox" name="hobby" value="篮球" "/>篮球
+					<span id="spanHobby" class="errInfo"></span>
+				</td>
+			</tr>
+			<tr>
+				<td width="300" align="right" height="30">自我介绍:</td>
+				<td width="700">
+					<textarea id="mySelf" rows="10" cols="60"></textarea>
+                    <span id="spanMySelf" class="errInfo"></span>
+				</td>
+			</tr>
+			<tr>
+				<td width="300" align="right" height="30">&nbsp;</td>
+				<td width="700">
+					<input type="submit" value="注册" />
+					<input type="reset" value="取消" />
+				</td>
+			</tr>
+		</table>
+		</form>		
+        <script>
+        //验证账号
+        function checkUserName() {
+            if ($("#txtAccount").val() == "") {
+                $("#spanAccount").html("用户名不能为空！");
+            } else {
+                $("#spanAccount").html("");
+                return true;
+            }
+        }
+
+        //账号失焦
+        $("#txtAccount").blur(function () {
+            checkUserName();
+        })
+
+        //验证密码
+        function checkPassWord() {
+            if ($("#txtPwd").val() == "") {
+                $("#spanPwd").html("密码不能为空！");
+            } else {
+                var regExp = /\w{6}/;
+                if (!regExp.test($("#txtPwd").val())) {
+                    $("#spanPwd").html("密码需要6位以上");
+                } else {
+                    $("#spanPwd").html("");
+                    return true;
+                }
+
+            }
+        }
+
+        //密码失焦
+        $("#txtPwd").blur(function () {
+            checkPassWord();
+        })
+
+         //确认密码
+         function checkPassWordOk() {
+            if ($("#txtPwdOk").val() == "") {
+                $("#spanPwdOk").html("确认密码不能为空");
+            } else {
+                if ($("#txtPwdOk").val() != $("#txtPwd").val()) {
+                    $("#spanPwdOk").html("两次密码不一致");
+                } else {
+                    $("#spanPwdOk").html("");
+                    return true;
+                }
+            }
+
+        }
+
+        //确认密码失焦
+        $("#txtPwdOk").blur(function () {
+            checkPassWordOk();
+        })
+
+        //性别
+        function checkSex(){
+          const arr = [];
+          var num = 0;
+          $("input[type=radio]").each(function(i,e){
+            arr[i] = e.checked;
+          })
+          arr.forEach(e=> e==true?num++:num);
+          if(num == 0){
+            $("#spanSex").html("爱好不能为空!");
+          }else{
+            $("#spanSex").html("");
+            return true;
+          }
+        }
+
+        //专业
+        function checkMajor(){
+           if($("#selProfessional").val() == ""){
+            $("#spanProfessional").html("专业不能为空!")
+           }else{
+            $("#spanProfessional").html("")
+            return true;
+           }
+        }
+
+        //爱好
+        function checkHobby(){
+            const arr = [];
+            var num = 0;
+            $("input[type=checkbox]").each(function(i,e){
+                arr[i] = e.checked;
+            })
+            arr.forEach(e => e==true?num++:num);
+            if(num == 0){
+                $("#spanHobby").html("爱好不能为空");
+            }else{
+                $("#spanHobby").html("");
+                return true;
+            }
+        }
+
+        //自我介绍
+        function checkMyself(){
+            if($("#mySelf").val() == ""){
+                $("#spanMySelf").html("自我介绍不能为空！")
+            }else{
+                $("#spanMySelf").html("")
+                return true;
+            }
+        }
+
+        //自我介绍失焦
+        $("#mySelf").blur(function(){
+            checkMyself();
+        })
+
+        
+        //注册
+        $("input").eq(-2).click(function () {
+            var a = checkUserName();
+            var b = checkPassWord();
+            var c = checkPassWordOk();
+            var d = checkSex();
+            var e = checkMajor();
+            var f = checkHobby();
+            var g = checkMyself();
+            if(a && b && c && d && e && f && g){
+                alert("注册成功")
+            }else{
+                 return false;
+            }
+           
+        })
+            
+        </script>
+	</body>
+</html>
\ No newline at end of file
diff --git "a/25\346\210\264\344\277\212\351\224\213/\347\254\224\350\256\260/2022.11.30.md" "b/25\346\210\264\344\277\212\351\224\213/\347\254\224\350\256\260/2022.11.30.md"
new file mode 100644
index 0000000..16db4e9
--- /dev/null
+++ "b/25\346\210\264\344\277\212\351\224\213/\347\254\224\350\256\260/2022.11.30.md"
@@ -0,0 +1,59 @@
+```html
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
+</head>
+
+<body>
+    <div>
+        <button id="but"> 按钮 </button>
+    </div>
+    <script>
+        //事件的链式绑定
+        // $("#but").click(function(){
+        //     console.log("按钮被点击");
+        // }).hover(function(){
+        //     console.log("鼠标在按钮上移动");
+        //})
+
+        //bind() 为多个事件绑定同一个按钮 多个事件用空格隔开
+        // $("#but").bind("click dblclick",function(){
+        //     console.log("按钮触发事件");
+        // })
+
+        //on()  可以为动态节点绑定事件 on()可以替代bind()
+        // $("#but").on("click dblclick",function(){
+        //     console.log(123);
+        // })
+
+        //contextmenu：右键菜单事件
+        // $(document).contextmenu(
+        //     function () {
+        //         return false;
+        //     }
+        // )
+
+        //当事件处理的元素等于事件的实际目标元素的时候，e.target和e.currentTarget以及this三者相同。
+        //当事件处理的元素不等于事件的实际目标元素的时候，e.currentTarget和this两者相同，但e.target不与这两者相同。
+
+        //off() 解绑事件
+        //one：只触发一次事件
+        // $("#but").click(function(){
+        //     alert("点击");
+        //     $(this).off();
+        // })
+        // $("#but").one("click",function(){
+        //     alert("点击");
+        // })
+    </script>
+</body>
+
+</html>
+```
+
-- 
Gitee


用户名:	+ +
密码:	+ +
密码确认:	+ +
性别:	+ 男 + 女 + +
专业:	+ + +
爱好:	+ 抽烟 + 喝酒 + 打游戏 + 烫头发 + 足球 + 篮球 + +
自我介绍:	+ + +
	+ + +