zoukankan      html  css  js  c++  java
  • 第九章 表单效验

    表单效验的重要性:

        使用JavaScript可以十分便捷地进行表单验证,它不但能检查用户输入的无效或错误的数据,还能检查用户遗漏的必选项,从而减轻服务器的压力,避免服务器端的信息出现错误。

    表单选择器

      :input:匹配所有input,textarea,select和button元素;

      :text:匹配所有单行文本框;

      :password:匹配所有密码框;

      :radio:匹配所有单项按钮;

      :checkbox:匹配所有复选框;

      :submit:匹配所有提交按钮;

      :image:匹配所有图像域;

      :reset:匹配所有重置按钮;

      :button:匹配所有按钮;

      :file:匹配所有文件域;

      :hidden:匹配所有不可见元素,或者type为hidden的元素

        

    表单属性过滤器

      :enabled:匹配所有可用元素;

      :disabled:匹配所有不可用元素;

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

      :selected:匹配所欲选中的option元素;

    表单验证事件的方法

      事件:

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

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

      方法:

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

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

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

        

        

    正则表达式:

      定义正则表达式:

        普通方法:

          var reg=/表达式/ 附加参数/

          表达式:一个字符串代表了某种规则,其中可以使用某些特殊字符来代表特殊的规则

          附加参数:用来扩展表达式的含义;

          参数:

            g:代表可以进行全局匹配;

            i:代表不区分大小写匹配;

            m:代表可以进行多行匹配;

          实例:

            var reg=/white/;

            var reg=/white/g;  

        构造函数:

          var reg=new RegExp("white");

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

          说明:

            普通方式中的表达式必须是一个常量字符串,而构造函数中的表达式可以是常量字符串,也可以是一个JavaScript变量。

      表达式的模式:

        简答模式:

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

          var reg=/china/;

          var red=/abc8/;

        复合模式:

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

          var reg=/^w+$/;

          RegExp对象:

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

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

               var str="my cat";

              var reg=/cat/;

              var result=reg.test(str);

          String对象的方法:

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

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

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

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

          match()方法:

            var str="my cat";

            var reg=/cat/;

            var result=str.match(reg);

          replace()方法:

            var str="my little white cat,is really a very lively cat";

            var result=str.replace(/cat/,"dog");

            var results=str.replace(/cat/g,"dog");

          split()方法:

            var str="red.blue,green,white";

            var result=str.split(",");

            var string="";

            for(var i=0;i<result.length;i++){

              string+=result[i]+" ";

            }

            alert(string);

          RegExp对象的属性:

            global:RegExp对象是否具有标志g;

            ignoreCase:RegExp对象是否具有标志i;

            multiline:RegExp对象是否具有标志m;

    正则表达式

        正则表达式的常用符号:

            

        正则表达式的重要字符:

            

          正则表达式(),[],{}的区别:

              ():为了提取匹配的字符串,表达式中有几个()就有几个相应的匹配字符串;

              []:定义匹配的字符串;

              {}:用来匹配长度;

          实例:

              

              

    使用HTML5的方式验证表单

      HTML5新增验证属性

          

        placeholder:

            

        required:

            

        pattern:

            

      validity属性:

          

          

          

        实例:

          

  • 相关阅读:
    ThinkPhp3.2.3缓存漏洞复现以及修复建议
    thinkphp3.2.3 缓存导致getshell终极解决办法
    phpstudy后门漏洞复现php5.2
    phpStudy后门漏洞利用复现
    SQL语句利用日志写shell拿权限
    针对phpstudy默认设置的利用
    黑暗世界的搜索引擎
    CVE-2019-0708—微软RDP远程桌面代码执行漏洞复现
    记一次渗透某XX站
    通过USB 2.0电缆手动设置内核模式调试
  • 原文地址:https://www.cnblogs.com/wnwn/p/11064972.html
Copyright © 2011-2022 走看看