感谢您的支持,我会继续努力的!
打开微信扫一扫,即可进行扫码打赏哦
点我查看本站打赏源码!
Powered by RUNCODEX.COM,学的不仅是技术,更是梦想!!!
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>邮箱验证</title>
<style>
#notice{ font-szie:14px; font-family:SimHei }
div{ color:red; margin-top:30px;}
p{ color:red; padding-left: 30px; }
</style>
</head>
<body>
Email:
<input type="text" id="texts" value="" />
<span id="notice"></span>
<div>规则:</div>
<p>1、不能以0字开头</p>
<p>2、@</p>
<p>3、必须是数字与字母组成,长度为2-10位</p>
<p>4、结尾一组,字母长度为2-4位</p>
<p>5、 .字母,最少一组,最多三组</p>
<script>
/*id是全局唯一的,不需要获取元素,直接使用*/
let re = /^\w+@[a-zA-Z0-9]{2,10}(?:\.[a-z]{2,4}){1,3}$/;
//绑定文本输入时触发的事件
texts.oninput = function() {
let textBox = this.value;
//判断检测这个值是否正确,
if (re.test(textBox)) { //如果验证正确执行以下代码
notice.innerHTML = '邮箱验证成功';
notice.style.color = 'plum';
} else { //验证不成功,执行以下代码
notice.innerHTML = '邮箱验证不成功,请重新输入';
notice.style.color = 'green';
}
</script>
</body>
</html>
输入 JavaScript 代码……
xxxxxxxxxx
输入 CSS 代码……