js点单验证
来源:互联网 发布:手机淘宝如何修改差评 编辑:程序博客网 时间:2024/06/10 14:23
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> body { background: #ccc; } label { width: 40px; display: inline-block; } span { color: red; } .container { margin: 100px auto; width: 400px; padding: 50px; line-height: 40px; border: 1px solid #999; background: #efefef; } span { margin-left: 30px; font-size: 12px; } .wrong { color: red } .right { color: green; } .defau { width: 200px; height: 20px; } .de1 { background-position: 0 -20px; } </style></head><body><div class="container" id="dv"> <label>Q Q</label><input type="text" id="qq"><span></span><br/> <label>手机</label><input type="text" id="phone"><span></span><br/> <label>邮箱</label><input type="text" id="e-mail"><span></span><br/> <label>座机</label><input type="text" id="telephone"><span></span><br/> <label>姓名</label><input type="text" id="fullName"><span></span><br/></div><script> //获取每个文本框验证这个文本框中的内容是否匹配,如果匹配则在后面的span标签中有正确的提示,如果错就提示输入错误 /** * QQ: /^[1-9][0-9]{5,11}$/ * 手机: /^[1][345678][0-9]{9}$/ * xiaoyang@126.com * 邮箱: /^[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_]+([.][a-zA-Z]+){1,2}$/ * 座机: /^[0][0-9]{2,3}[-][0-9]{7,8}/ * * 姓名: /[\u4e00-\u9fa5]{2,3}/ * * * * * */ //第一步 写正则表达式 //第二步 获取文本框 var qq=document.getElementById("qq"); function checkText(element,reg){ element.onblur=function(){ if(reg.test(this.value)){ this.nextElementSibling.innerHTML="输入正确"; this.nextElementSibling.style.color="green"; }else{ this.nextElementSibling.innerHTML="输入不正确"; this.nextElementSibling.style.color="red"; } }; } console.log(checkText(qq, /^[1-9][0-9]{5,11}$/));</script></body></html>
0 0
- js点单验证
- js中表单验证
- js单选按钮验证
- JS验证(网页设计中表单数据的验证)
- js中表单验证常用到的正则表达式
- JS中表单验证常用到的事件
- JS验证
- js 验证
- js 验证
- JS验证
- js 验证
- js 验证
- js验证
- js 验证
- JS验证
- js 验证
- JS验证
- JS 验证
- ReactNative实现ListView分组,悬浮效果
- 移植MYSQL
- 第五讲项目2.3-摄氏度转华氏度
- Spark RDD Transformation 简单用例(三)
- Page Differential Logging: 页差分读写技术(二)
- js点单验证
- JS知识点
- BottomNavigationView 的使用
- 编译apue.3e缺少依赖库-lbsd
- web前端攻击详解
- Hive的安装部署
- php解析Elasticsearch的返回值
- 浅谈IOC--说清楚IOC是什么
- 关于svn提交时候遇到的问题