Ⅰ . 完 成 表 单 验 证 功 能 \color{Red}{Ⅰ.完成表单验证功能} Ⅰ.完成表单验证功能

<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script>
		function validForm(){
			var x=document.forms["myform"]["fname"].value;
			if(x==""){
				alert("必须填写姓名!!!");
				return false;
			}
		}
	</script>
</head>
<body>
	<form name="myform" οnsubmit="return validForm()" action="4.22网页设计/书上的练习.html">
		姓名:<input type="text" name="fname">
		<input type="submit" value="提交">
	</form>
</body>

其 中 f o r m 的 n a m e 属 性 是 方 便 查 找 其中form的name属性是方便查找 其中form的name属性是方便查找
o n s u b m i t 是 点 击 按 钮 时 间 onsubmit是点击按钮时间 onsubmit是点击按钮时间
a c t i o n 是 跳 转 的 界 面 action是跳转的界面 action是跳转的界面

验 证 数 字 也 是 同 理 \color{Pink}{验证数字也是同理} 验证数字也是同理

<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script>
		function myFunction(){
			var x=document.getElementById("numb").value,text;
			if(isNaN(x)||x<1||x>10)	text="请用你的智商看看输入什么";
			else	text="成功!!你真聪明!!";
			document.getElementById("demo").innerHTML=text;
		}
	</script>
</head>
<body>
	<p>请输入1到10间的数字:</p>
	<input type="text" id="numb">
	<button type="button" οnclick="myFunction()">提交</button>
	<p id="demo"></p>
</body>

但是，input输入框自带属性required检验功能

<input type="text" name="fname" required>