微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

第9章 表单校验

为什么要表单验证

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

 

 

 

分享图片

常用的表单验证

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

分享图片

表单选择器

 

分享图片

分享图片

属性过滤选择器

 

分享图片

验证表单内容

使用String 对象验证邮箱:不能为空,格式正确。

非空验证:

分享图片

字符串查找:indexOf():

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

分享图片

文本框内容的验证:

密码不能为空,不少于6个字符,姓名不能为空,不能有数字。

长度验证:

分享图片

 

判断字符串是否有数字:

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

分享图片

 

表单验证事件和方法

表单验证需要综合运用元素的事件和方法

 

分享图片

正则表达式:

为什么需要正则表达式:

  1. 简洁的代码
  2. 严谨的验证文本框中的内容示例:

    示例:

    分享图片

  3. 普通方式:

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

  4. 分享图片

    【表达式必须是常量字符串】

    【用某些附加参数来代表一些规则:g代表可以进行全局匹配;i代表不区分大小写;m代表可以进行多行匹配】

    构造函数:var reg=new RegExp("表达式","附加参数")

  5. 分享图片

  6. 简单模式:

    只能表示具体的匹配

  7. 分享图片

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

     
  8. 分享图片

    使用HTML5的方式验证表单:

    HTML5新增验证属性

  9. 分享图片

    示例:

  10. 分享图片

    分享图片

    分享图片

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐