【javaweb】JS简单的注册页面数据校验

今天刚学JavaScript,利用JS对注册页面的输入数据进行简单的检验,还是有些不太懂的地方,记录一下。

上源码:

<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<!--
			1.校验用户名, 长度不能小于6位
				1.确定事件: 提交事件 onsubmit
				2.事件要触发函数 checkForm()
				3. 函数中要去做一些校验
		-->
		<script>
			function checkForm(){
				
				//获取用户输入的内容
				var input1 = document.getElementById("username");
                //alert(input1.value);
				var uValue = input1.value;
				if(input1.value.length >= 6){
			    }else{
					alert("对不起,用户名太短啦!")
					return false;
				}
				//邮箱的校验
				//获取用户输入的邮箱的值
				var email = document.getElementById("email")
				var uEmail = email.value;
				if(/^[a-z0-9]+([._\\-]*[a-z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/.test(uEmail)){
					alert("校验成功");
				}else{
					alert("校验失败")
					return false;
				}
				return true;;
			}
		</script>
	</head>
	<body>
		<form action="../01-网站首页的优化/网站首页.html" onsubmit="return checkForm()">
			用户名:<input type="text" id="username" /><br />
			密码:<input type="password" id="password" /><br />
			邮箱:<input type="text" id="email" /><br />
			<input type="submit" value="提交" />
		</form>
	</body>

主要还是对HTML DOM对象不熟系,希望接下来几天多看下文档(http://www.w3school.com.cn/jsref/dom_obj_event.asp)。

猜你喜欢

转载自blog.csdn.net/qq_42370146/article/details/84257834
今日推荐