使用javascript验证表单_myform.num-优快云博客

本文链接：https://blog.youkuaiyun.com/zjcheer_up/article/details/43670147

本文介绍了一个简单的HTML页面，该页面使用JavaScript进行表单验证。验证包括检查输入是否为空、日期格式是否正确以及工资和奖金是否为数字。通过这个示例可以了解如何在提交表单之前使用JavaScript进行基本的数据验证。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>Father.html</title>

		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">

		<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
		<script language="JavaScript">
			function fun(){
				var num = document.myform.num.value
				if(isNaN(num)){
				alert("编号只能输入数字");
				}
				var name=document.myform.name.value
				 if(name.length==0){
				 alert("姓名不能为空");
				 }
				 if(document.myform.job.value.length==0){
				 alert("工作不能为空");
				 }
				 var z=/^(\d{4})-(\d{2})-(\d{2})$/
				 var str = document.myform.data.value;
				 if(!z.test(str)){
				 	alert("日期格式不正确");
				 }
				 var re = /^[0-9]+.?[0-9]*$/;         
    			 if (!re.test(document.myform.off.value))  
   				 {  
      				  alert("工资请输入数字");  
      				  document.myform.off.focus();  
      				 return false;  
   	  }  
				var re1 = /^[0-9]+.?[0-9]*$/;         
    			 if (!re1.test(document.myform.mon.value))  
   				 {  
      				  alert("奖金请输入数字");  
      				 document.myform.mon.focus();  
      				 return false;  
   	  }  

			}
</script>
	</head>

	<body>
		<form name="myform">
			雇员编号:
			<input type="text" name="num" />
			<br/>
			雇员姓名：
			<input type="text" name="name" /><br/>
			雇员工作：
			<input type="text" name="job" /><br/>
			雇员日期：
			<input type="text" name="data" /><br/>
			基本工资：
			<input type="text" name="off" /><br/>
			奖金:
			<input type="text" name="mon" /><br/>
			<input type="button" value="确定" onClick="fun()" /><br/>
		</form>
	</body>
</html>