zoukankan      html  css  js  c++  java
  • 表单校验

    一、表单验证的必要性

      01、节约时间,提升用户体验

      02、减轻服务器压力

    二、表单验证的方式

      01、使用String对象验证

      02、使用HTML的方式验证表达式

      03、表单框架验证表单

    三、表单属性过滤选择器

        :input    匹配所有inout、textarea、select、button元素

        :text    匹配所有单行文本框

        :password  匹配所有密码框

        :radio    匹配所有单项按钮

        :checkbox  匹配所有复选框

        :submit    匹配所有提交按钮

        :image    匹配所有图像域

        :reset    匹配所有重置按钮

        :button   匹配所有按钮

        :file    匹配所有文件域

        :hidden   匹配所有不可见元素,或者type为hidden的元素    (style="display:none"和type="hidden"的都可以)

        :enabled  匹配所有可用元素    $("form :enabled")匹配form内部除编号输入框外的所有元素

        :disabled  匹配所有不可用元素   $("form :disabled")匹配 编号输入框

        :checked  匹配所有被选中元素   (复选框、单项按钮、select中的option) 

        :selected  匹配所有选中的option元素

    四、表单事件和方法

      事件:

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

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

      方法:

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

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

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

    五、正则表达式

      01、优势:

        可以简化验证代码  

        使验证的内容更加准确

      02、定义:

        正则表达式是描述字符模式的对象,它由一些特殊的符号组成。RegExp对象是Regular Expression(正则表达式)的缩写

      03、定义正则表达式

        普通方式:

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

          普通方式的表达式必须是一个常量字符串

          附加参数可选,主要有3个:

            g  代表可以进行全局匹配

            i  代表不区分大小写匹配

            m  代表可以进行多行匹配

        构造函数:

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

          构造函数的表达式可以是常量字符串,也可以是一个JavaScript变量

      04、表达式的模式

        简单模式:

          简单模式是指通过普通字符的组合来表达的模式

        复合模式:

          复合模式是指含有通配符来表达的模式

     六、使用HTML5方式验证表单

      placeholder  输入一种提示

      required   输入域不能为空

      pattern    规定输入域的模式(正则表达式)

  • 相关阅读:
    使用element-ui组件el-table时需要修改某一行样式(包含解决样式无效的问题)或某一列的样式
    面试题:线程A打印1-10数字,打印到第5个数字时,通知线程B
    面试题:不使用数学库求平方根
    Springboot2.x集成Redis集群模式
    Springboot2.x集成Redis哨兵模式
    Springboot2.x集成单节点Redis
    基本算法:冒泡排序算法
    Redis进阶:Redis的哨兵模式搭建
    Redis进阶:Redis的主从复制机制
    Redis的消息订阅及发布及事务机制
  • 原文地址:https://www.cnblogs.com/vic_/p/7894392.html
Copyright © 2011-2022 走看看