zoukankan      html  css  js  c++  java
  • 表单校验及正则表达式

    1:为什么要进行表单验证?

    减轻服务器的压力 保证输入的数据符合要求

    2:常用的表单验证

    日期格式 表单元素是否为空 用户名和密码 E-mail地址 身份证号码

    3:为什么使用表单选择器

    表单选择器用于选取某些特定的表单元素

    所有单选按钮或隐藏的元素

    4:非空验证

    if (mail == "") {

    alert("Email不能为空");

    return false; }

    5:字符串查找

    indexOf():查找某个指定的字符串值在字符串中首次出现的位置

    eg:

    var str="this is JavaScript";

    var selectFirst=str.indexOf("Java");

    var selectSecond=str.indexOf("Java",12);

    6:长度验证

    if(pwd.length<6){

    alert("密码必须等于或大于6个字符");

    return false; }

    7:判断字符串是否有数字

    使用for循环和substring()方法依次截取单个字符,再判断每个字符是否是数字

    for (var i = 0; i < user.length; i++) { var j = user.substring(i, i + 1);

    if (isNaN(j) == false) {

    alert("姓名中不能包含数字"); return false;

    } }

    8:表单验证事件和方法

    事件:

    onblur:失去焦点,当光标离开某个文本框时触发

    onfocus:获得焦点,当光标进入某个文本框时触发

    方法:

    blur():从文本域中移开焦点

    focus():在文本域中设置焦点,即获得鼠标光标

    select():选取文本域中的内容,突出显示输入区域的内容

    9:为什么需要正则表达式?

    简洁的代码 严谨的验证文本框中的内容 生产环境中更为常用的方式

    10:定义正则表达式

    普通方式:

    语法:var reg=/表达式/附加参数;

    eg:

    var reg=/white/;

    var reg=/white/g;

    构造函数

    语法:

    var reg=new RegExp("表达式","附加参数");

    eg:

    var reg=new RegExp("white");

    var reg=new RegExp("white","g");

    11:表达式的模式

    简单模式

    只能表示具体的匹配

    eg:

    var reg=/china/; var reg=/abc8/;

    复合模式

    可以使用通配符表达更为抽象的规则模式

    eg:

    var reg=/^w+$/; var reg=/^w+@w+.[a-zA-Z]{2,3}(.[a-zA-Z]{2,3})?$/;

    12:文本输入提示特效
    实现思路
    把错误信息显示在<span>中,然后使用html()方法,设置<span>和
    </span>之间的内容
    编写脚本验证函数
    鼠标失去焦点时(blur事件)调用验证函数

    13:RegExp对象

    RegExp对象的方法

    exec( ):检索字符中是正则表达式的区配,返回找到的值,并确定其位置

    test( ):检索字符串中指定的值,返回true或false

    RegExp对象的属性

    global:RegExp对象是否具有标志g,表示全局匹配

    ignoreCase:RegExp对象是否具有标志i,表示不区分大小写

    multiline:RegExp对象是否具有标志m,表示多行匹配

    14:String对象

    String对象的方法

    match( ):找到一个或多个正则表达式的匹配

    search( ):检索与正则表达式相匹配的值

    replace( ):替换与正则表达式匹配的字符串

    split( ):把字符串分割为字符串数组

    15:正则表达式符号

    /…/

    代表一个模式的开始和结束

    ^

    匹配字符串的开始

    $

    匹配字符串的结束

    s

    任何空白字符

    S

    任何非空白字符

    d

    匹配一个数字字符,等价于[0-9]

    D

    除了数字之外的任何字符,等价于[^0-9]

    w

    匹配一个数字、下划线或字母字符,等价于[A-Za-z0-9_]

    W

    任何非单字字符,等价于[^a-zA-z0-9_]

    .

    除了换行符之外的任意字符

    {n}

    匹配前一项n次

    {n,}

    匹配前一项n次,或者多次

    {n,m}

    匹配前一项至少n次,但是不能超过m次

    *

    匹配前一项0次或多次,等价于{0,}

    +

    匹配前一项1次或多次,等价于{1,}

    匹配前一项0次或1次,也就是说前一项是可选的,等价于{0,1}

    16:HTML5新增属性

    placeholder

    required …

    17:validity属性

    stepMismatch

    customError …

    18:HTML5新增验证属性

    placeholder

    提供一种提示(hint),输入域为空时显示,获得焦点输入内容后消失

    required

    规定输入域不能为空

    pattern

    规定验证input域的模式(正则表达式)

  • 相关阅读:
    jenkins集群(三) -- master和slave配置git
    jenkins集群(二)(master --> slave) -- allure自动化测试报告部署
    jenkins集群(一) -- 在Linux上部署
    APP自动化 -- contexts(上下文切换)
    APP自动化 -- 滑动解锁、滑动验证
    APP自动化 -- 坐标获取和点击
    APP自动化 -- 获取toast元素的文本内容
    APP自动化 -- MobileBy
    Python学习-基础数据类型补充操作、bytes类型
    Kafka-生产者、消费者、自定义分区器
  • 原文地址:https://www.cnblogs.com/zjx-959/p/13231126.html
Copyright © 2011-2022 走看看