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. 字符串题汇总(python3)

    1.最小编辑距离 假设有两个字符串s1和s2,计算通过增添.删除.替换三种操作后,从s1转变为s2所需要的操作次数. #coding=utf-8 class Solution: def editDis ...

  2. android侧滑效果（引用官方网站提供的API文件）

    原文地址:http://www.cnblogs.com/android100/p/android-SlidingMenu.html 在新浪微博和唱吧里面都有看到android的侧滑效果,于是想要学习一 ...

  3. ng-trim

    最近新做了一个需求,要求在angular.js的input 文本框中做到去除首尾空格,实现精确查询. 查了很多正则表达式,后来才发现angular.js项目中默认就能去除首尾空格,ng-trim  默 ...

  4. Day6 - L - Mokia HYSBZ - 1176

    维护一个W*W的矩阵,初始值均为S.每次操作可以增加某格子的权值,或询问某子矩阵的总权值.修改操作数M<=160000,询问数Q<=10000,W<=2000000. Input 第 ...

  5. uniapp 小程序 flex布局 v-for 4栏展示

    注:本项目的图片资源来源于后端接口,所以使用的是v-for. 关键词:uniapp 小程序 flex布局 v-for 4栏展示 自适应 <view style="display: fl ...

  6. oracle通用帮助类

    需要的dll( EntityFramework.6.0.0Oracle.ManagedDataAccess.12.1.2400System.Configuration.dllEmitMapper.1. ...

  7. 自己写个tween

    public Vector3 begin,end;//起始终止坐标 public float BtoE_time;//用时 float timer,lerp;//计时器和进度值 void Update ...

  8. 利用ZXing.Net生成和识别二维码

    ZXing.Net:ZXing是一个开放源码的,用Java实现的多种格式的1D/2D条码图像处理库. github:https://github.com/micjahn/ZXing.Net 直接将字符 ...

  9. LeetCode1005 K次取反后最大化的数组和（贪心+Java简单排序）

    题目: 给定一个整数数组 A,我们只能用以下方法修改该数组:我们选择某个个索引 i 并将 A[i] 替换为 -A[i],然后总共重复这个过程 K 次.(我们可以多次选择同一个索引 i.) 以这种方式修 ...

  10. mfc WebBrowser打开本地网页

    本地路径要用file协议,例子:file:///c:/abc/def.html注意点:file:后面是3个正斜杠,路径中用正斜杠(不是标准的反斜杠).如果你觉得IE地址栏支持标准的路径写法,那么你就错 ...