JavaScript练习(一)

学习了JavaScript基础,试着完成三个小的Demo练习

一、输入验证,用户需要在页面上输入用户名和电话号码,格式如下:

用户名(3到6位字母数字的组合)

电话号码(6位数字)

输入格式正确,则弹出录入正确,格式错误则弹出录入错误!


========================================答案========================================

html代码:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>

用户名(3到6位字母数字的组合):<input type="text" id="username" onblur="userJudge()"/><br />

电话号码(6位数字):<input type="text" value="" id="tel" onblur="telJudge()"/><br />
</body>
<script>
function userJudge(){
	var userN = document.getElementById("username");
	var regs = /^[a-zA-Z0-9]{3,6}$/;
	var reg = new RegExp(regs);	
	var result = reg.test(userN.value);
	if(result){
		alert('录入正确');
	}else{
		alert('录入错误')	
	}
	}
function telJudge(){
	var phone = document.getElementById("tel");
	var regs = /^[0-9]{6}$/;
	var reg = new RegExp(regs);	
	var result = reg.test(phone.value);
	if(result){
		alert('录入正确');
	}else{
		alert('录入错误')	
	}
}

</script>
</html>

效果图:

JavaScript练习(一)_第1张图片


JavaScript练习(一)_第2张图片




JavaScript练习(一)_第3张图片


JavaScript练习(一)_第4张图片





你可能感兴趣的:(JavaScript,html)