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-表单验证二的更多相关文章

  1. js 表单验证控制代码大全

    js表单验证控制代码大全 关键字:js验证表单大全,用JS控制表单提交 ,javascript提交表单:目录:1:js 字符串长度限制.判断字符长度 .js限制输入.限制不能输入.textarea 长 ...

  2. jquery.validation.js 表单验证

    jquery.validation.js 表单验证   官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation jQuer ...

  3. JS表单验证-12个常用的JS表单验证

    JS表单验证-12个常用的JS表单验证 最近有个项目用到了表单验证,小编在项目完结后的这段时间把常用的JS表单验证demo整理了一下,和大家一起分享~~~ 1. 长度限制 <p>1. 长度 ...

  4. Jquery.validate.js表单验证插件的使用

    作为一个网站web开发人员,以前居然不知道还有表单验证这样好呀的插件,还在一行行写表单验证,真是后悔没能早点知道他们的存在. 最近公司不忙,自己学习一些东西的时候,发现了validation的一个实例 ...

  5. angular js 表单验证

    <!doctype html> <html ng-app="myapp"> <head> <meta charset="UTF- ...

  6. JS表单验证类HTML代码实例

    以前用的比较多的一个JS表单验证类,对于个人来说已经够用了,有兴趣的可以在此基础上扩展成ajax版本.本表单验证类囊括了密码验证.英文4~10个 字符验证. 中文非空验证.大于10小于100的数字.浮 ...

  7. Js表单验证控件-02 Ajax验证

    在<Js表单验证控件(使用方便,无需编码)-01使用说明>中,写了Verify.js验证控件的基本用法,基本可以满足大多数验证需求,如果涉及服务端的验证,则可以通过Ajax. Ajax验证 ...

  8. jQuery.validate.js表单验证插件

    jQuery.validate.js表单验证插件的使用 效果: 代码: <!DOCTYPE html> <html lang="en"> <head& ...

  9. js表单验证工具包

    常用的js表单验证方法大全 /* 非空校验 : isNull() 是否是数字: isNumber(field) trim函数: trim() lTrim() rTrim() 校验字符串是否为空: ch ...

  10. 一个漂亮的js表单验证页面+验证码

    一个漂亮的js表单验证页面 见图知其意, 主要特性 带密码安全系数的判断 其他的就没有啥啦 嘿嘿嘿 当然,其代码也在Github上 我也准备了一套可以直接Ctrl + v; Ctrl + c 运行的代 ...

随机推荐

  1. 08.swoole学习笔记--异步tcp客户端

    <?php //创建异步tcp客户端 $client=new swoole_client(SWOOLE_SOCK_TCP,SWOOLE_SOCK_ASYNC); //注册连接成功的回调函数 $c ...

  2. yolov3输出检测图片位置信息

    前言 我们在进行图片识别后需要进行进一步的处理,该文章会介绍:1.怎样取消lables;2.输出并保存(.txt)标记框的位置信息 一.去掉label 在darknet/src/image.c 收索d ...

  3. Golang的基础数据类型-浮点型

    Golang的基础数据类型-浮点型 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.浮点型概述 Go语言提供两种精度的浮点数,即float32和float64,其中float32 ...

  4. 32位CPU和64位CPU 区别

    操作系统只是硬件和应用软件中间的一个平台. 32位操作系统针对的32位的CPU设计. 64位操作系统针对的64位的CPU设计.操作系统只是硬件和应用软件中间的一个平台. 32位操作系统针对的32位的C ...

  5. 利用vim查看日志,快速定位问题《转载》

    利用vim查看日志,快速定位问题 链接:https://www.cnblogs.com/abcwt112/p/5192944.html

  6. 如何将sql文件导入数据库

    打开navicat.exe,点击打开数据库,右键-运行SQL文件,选中要运行的sql文件,确定后再点击表即可. 注意:此次改变后,源sql文件可以转移路径

  7. while循环和do-while循环语句

    while 语句 条件表达式的结果是一个 boolean 值,如果为true,则执行循环体:如果为 false,循环就会结束. while 循环体是一个代码块,所以 while 循环是可以嵌套其他的语 ...

  8. 九十五、SAP中查看自定义包的所有模块，对象，函数主，事务等

    一.输入SE80 二.选择包,再查下Z* 三.可以看到,查下出来的包 四.可以看到我们想要的内容了

  9. 022-PHP数组排序asort

    <?php // 构造一个数组变量 $users = array("bob" => "Yobert", "steve" => ...

  10. benchmark与gem5-gpu交互

    gem5-gpu作为一个异构多核系统的模拟器,当我们使用异构融合多核处理器架构(特别是支持HSA的处理器架构)运行GPU与CPU的benchmark时,研究自己设计的算法或添加的硬件对GPU与CPU存 ...