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. mysq8设置编码utf8

    设置mysql默认编码utf8 以及其他配置 系统:centos7 vi /etc/my.cnf #红色部分如果以存在则在他的下方添加 [mysql] default-character-set=ut ...

  2. vDom和domDiff

    虚拟dom和domDiff 1. 构建虚拟DOM var tree = el('div', {'id': 'container'}, [ el('h1', {style: 'color: blue'} ...

  3. 利用Python实现自动扫雷

    自动扫雷一般分为两种,一种是读取内存数据,而另一种是通过分析图片获得数据,并通过模拟鼠标操作,这里我用的是第二种方式. 一.准备工作 我的版本是 python 3.6.1python的第三方库:win ...

  4. 031、Java中偶数偶数的判断方法

    01.代码如下: package TIANPAN; /** * 此处为文档注释 * * @author 田攀 微信382477247 */ public class TestDemo { public ...

  5. 【转】转帖并注释:Java中的事件处理机制--事件监听器的四种实现方式

    原文地址:http://blog.sina.com.cn/s/blog_4b650d650100nqws.html Java中四种事件监听器的实现方式分别为: 自身类做为事件监听器 外部类作为事件监听 ...

  6. 人脸识别 API Key和Secret Key作用

    App key简称API接口验证序号,是用于验证API接入合法性的.接入哪个网站的API接口,就需要这个网站允许才能够接入,如果简单比喻的话:可以理解成是登陆网站的用户名 App Secret简称AP ...

  7. SpringBoot-拦截器配置

    SpringBoot-拦截器配置 SpringBoot-拦截器配置 在我们的SSM项目中,可以在web.xml中配置拦截器,但是在SpringBoot中只能使用java类来配置,配置方法如下. 创建拦 ...

  8. Linux下Tomcat带日志启动命令

    在Linux环境下,启动Tomcat时我们需要在启动过程中看到日志信息.可以通过下面命令启动Tocmat. ./startup.sh; tailf ../logs/catalina.out或者 ./s ...

  9. Mysql多对多关系的查询

    1.创建user表 2.创建gateway表 3.创建user_gateway表 4.创建device表 5.创建gateway_device表 6.创建一个实体类 public class Devi ...

  10. 不可不知的spark shuffle

    shuffle概览 一个spark的RDD有一组固定的分区组成,每个分区有一系列的记录组成.对于由窄依赖变换(例如map和filter)返回的RDD,会延续父RDD的分区信息,以pipeline的形式 ...