JS-表单验证二
3.范围验证:年龄范围验证:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css"> </style>
</head> <body>
<form action="aa.html" method="post"> <!--<form> 中的两个必要属性:action,method-->
年龄:<input type="text" name="nl" id="nl" />
<input type="submit" value="登陆" id="b1" onclick= "return yz()" /> <!--onclick属性添加点击事件--> </form>
</body>
<script type="text/javascript">
function yz() //封装一个<body>中做成点击事件的函数
{
var nl = document.getElementById("nl").value; //通过id名 找到 元素并重新 赋值 if(nl<18) //判断条件
{
alert("你太年轻了!")
return false; }
else if(nl>60) //判断条件
{
alert("您已经老了,可以去跳广场舞了!");
return false;
}
else
{
return true; //满足条件时将执行表单的action
}
} </script>
不满足条件的提示如下:

4.正则验证:邮箱验证:
下面的代码检查输入的数据是否符合电子邮件地址的基本语法。
意思就是说,输入的数据必须包含 @ 符号和点号(.)。同时,@ 不可以是邮件地址的首字符,并且 @ 之后需有至少一个点号:
</head> <body>
<form action="aa.html" method="post">
邮箱:<input type="text" name="yx" id="yx" />
<input type="submit" value="登陆" id="b1" onclick= "return yz()" /> </form>
</body>
<script type="text/javascript">
function yz() //封装一个<body>中做成点击事件的函数
{
var yx = document.getElementById("yx").value; //通过id名 找到 元素并重新 赋值
var gf = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/; //邮箱的正则验证,记不住找百度
if(yx=="" || null)
{
alert("邮箱不能为空!");
return false;
}
else if(yx.match(gf)==null) //不是很明白这个函数的意思
{
alert("您输入的邮箱地址不符合规范,请核对后再输入!");
return false;
}
else
{
return true; //满足条件时将执行表单的action
}
} </script>
</html>
输入不当时输出的提示为:

附:1.JavaScript match() 方法
定义和用法
match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配,它返回指定的值,而不是字符串的位置。
例如:
<script type="text/javascript"> var str="1 plus 2 equal 3"
document.write(str.match(/\d+/g)) </script>
输出:
1,2,3 2.正则表达式:
正则表达式(regular expression)描述了一种字符串匹配的模式(pattern),可以用来检查一个串是否含有某种子串、将匹配的子串替换或者从某个
串中取出符合某个条件的子串等
构造正则表达式的方法和创建数学表达式的方法一样。也就是用多种元字符与运算符可以将小的表达式结合在一起来创建更大的表达式。正则表达式的组件可以是单个的字符、字符集合、字符范围、字符间的选择或者所有这些组件的任意组合。
正则表达式是由普通字符(例如字符 a 到 z)以及特殊字符(称为"元字符")组成的文字模式。模式描述在搜索文本时要匹配的一个或多个字符串。正则表达式作为一个模板,将某个字符模式与所搜索的字符串进行匹配。
JS-表单验证二的更多相关文章
- js 表单验证控制代码大全
js表单验证控制代码大全 关键字:js验证表单大全,用JS控制表单提交 ,javascript提交表单:目录:1:js 字符串长度限制.判断字符长度 .js限制输入.限制不能输入.textarea 长 ...
- jquery.validation.js 表单验证
jquery.validation.js 表单验证 官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuer ...
- JS表单验证-12个常用的JS表单验证
JS表单验证-12个常用的JS表单验证 最近有个项目用到了表单验证,小编在项目完结后的这段时间把常用的JS表单验证demo整理了一下,和大家一起分享~~~ 1. 长度限制 <p>1. 长度 ...
- Jquery.validate.js表单验证插件的使用
作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...
- angular js 表单验证
<!doctype html> <html ng-app="myapp"> <head> <meta charset="UTF- ...
- JS表单验证类HTML代码实例
以前用的比较多的一个JS表单验证类,对于个人来说已经够用了,有兴趣的可以在此基础上扩展成ajax版本.本表单验证类囊括了密码验证.英文4~10个 字符验证. 中文非空验证.大于10小于100的数字.浮 ...
- Js表单验证控件-02 Ajax验证
在<Js表单验证控件(使用方便,无需编码)-01使用说明>中,写了Verify.js验证控件的基本用法,基本可以满足大多数验证需求,如果涉及服务端的验证,则可以通过Ajax. Ajax验证 ...
- jQuery.validate.js表单验证插件
jQuery.validate.js表单验证插件的使用 效果: 代码: <!DOCTYPE html> <html lang="en"> <head& ...
- js表单验证工具包
常用的js表单验证方法大全 /* 非空校验 : isNull() 是否是数字: isNumber(field) trim函数: trim() lTrim() rTrim() 校验字符串是否为空: ch ...
- 一个漂亮的js表单验证页面+验证码
一个漂亮的js表单验证页面 见图知其意, 主要特性 带密码安全系数的判断 其他的就没有啥啦 嘿嘿嘿 当然,其代码也在Github上 我也准备了一套可以直接Ctrl + v; Ctrl + c 运行的代 ...
随机推荐
- Unix-Time
1. Unix_time 2. Year_2000_problem 3. Year_10,000_problem 4. Year_2038_problem 5. Time_formatting_and ...
- http协议请求报文与响应报文分析
什么是HTTP协议: HTTP是一个属于应用层的面向对象的协议,由于其简捷.快速的方式,适用于分布式超媒体信息系统.它于1990年提出,经过几年的使用与发展,得到 不断地完善和扩展.目前在WWW中使用 ...
- thinkphp3.2.3 缓存导致getshell终极解决办法
在Application\Runtime目录中创建文件.htaccess <IfModule mod_rewrite.c> deny from all </IfModule>
- 10. Regular Expression Matching正则表达式匹配
Implement regular expression matching with support for '.' and '*'. '.' Matches any single character ...
- Concurrent包下用过哪些类?
1.executor接口,使用executor接口的子接口ExecutorService用来创建线程池2.Lock接口下的ReentrantLock类,实现同步,比如三个线程循环打印ABCABCABC ...
- Service总结
Service Service的应用场景,以及和Thread区别 开启Service的两种方式以及区别 Service基础 Service是什么? Service(服务)是一个可以在后台长时间运行而没 ...
- UVA - 536 Tree Recovery (二叉树重建)
题意:已知先序中序,输出后序. #pragma comment(linker, "/STACK:102400000, 102400000") #include<cstdio& ...
- QObject的timerEvent使用
其实在QT里,我们自己写的类一般通常需要继承QObject类,因为这一类里规定好的拿来即可用的方法. 比如信号,槽,以及前一个博文写的movetothread方法,这里就是介绍一个QObject的ti ...
- VS2012 ffmpeg 没有定义的lrint
在common.h #ifndef AVUTIL_COMMON_H#define AVUTIL_COMMON_H下添加 #define lrint(f) (f>=0?(int32_t)(f+(d ...
- 4 —— node —— 启动一个 http 服务器
const http = require('http'); const server = http.createServer(); // 绑定客户端请求事件 // on => 绑定事件 // r ...