表单验证和正则表达式
第一部分:form表单基础
表单验证使用onblur还是onchange.
JavaScript中的正则表达式
提示:在JavaScript代码中,函数需要传入的参数是一个对象时,在函数主体body中一定需要对这个参数进行判断是否为null。
表单验证的作用:把输入的表单数据传入给JavaScript代码进行验证,可以让网络应用程序更加可靠,也能减少服务器的负担,同时减少客户端与服务器的带宽。
form表单常见需要验证的字段:
Message(字符串),ZIP code(邮政编码),日期(date),Phone Number(电话号码),Email(电子邮件),smart Phone Number(手机号码)。
form对象是一个数组,负责存储表单中所与域的值,但它的数组元素并非利用数值索引存储,而是使用域独有的name属性设定的标示符。在后台服务器接收form表单域的值也是通过name来作为标示符的。
onchange事件不可以用于验证表单域的值是否为空。onblur事件适合触发数据验证。如何处理用户复制/粘贴文本到表单域中?(onblur和onfocus是相反事件)
onblur事件:表单域失去焦点时触发。
onfocus事件:表单元素或表单域获得输入的焦点时触发。
this关键字,在HTML元素的上下文中,它代表该元素的对象。
alert框和弹出式广告(pop-up ad)
alert框会阻止用户当前进行的工作,强制用户按下确定按钮之后才能继续下一步操作。这种设计具有分裂性,所以alert框不适合用在数据验证的提示。
pop-up框目前是一种使用非常多的提示用户的方法。一方面可以在很小的空间显示更多的内容,另一方面能大大提供应用程序的交互性。缺点是在mobile devices时,操作起来不是很方便,同时开放起来相对要复杂一些,需要做适配设备的显示分辨率。
表单域的所有验证都通过后,可以调用form.submit()方法将表单的值提交给服务器。
第二部分:正则表达式(Regular Expression)
正则表达式专门设计用于匹配(match)文本模式(pattern),可用于创建模式,然后应用于文本字符串,搜索匹配的部分。
/Expression/ 正则表达式总是以斜线起始和结束。
元字符
. |
匹配任何字符,换行符(newline)除外 |
---|---|
d |
匹配任何数字字符 |
w |
匹配任何字母和数字字符串 |
s |
匹配空格 |
^ |
字符串以模式起始,从第一个字符开始匹配 |
$ |
字符串以模式结束,必须以此作为结束 |
| |
选择(|)提供指定可选的子模式 |
限定符前子模式(sub-pattern),限定符即应用于子模式,并控制子模式出现在模式里面的次数。
* |
限定符前的子模式必须出现0或多次 |
---|---|
+ |
限定符前的子模式必须出现1次或多次 |
? |
限定符前的子模式必须出现0或1次 |
{n} |
限定符前的子模式必须出现恰好n次 |
{min,max} |
限定符前的子模式必须出现至少min次,至多max次 |
() |
集合字符,/,元字符,成为子模式 |
字符串
[CharacterClass] 字符串总是以方括号围起来。一组匹配单一字符的正则表达式规则。 需要转义的特殊字符,必须在字符前加上反斜线()来转义:
[、]、^、$、.、|、?、*、+、(、)。
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 当 Python 遇到微信
- CenterNet之loss计算代码解析
- 爬取林丹和赵雅淇的微博评论,看看网友都说了些什么
- 静默安装单机Oracle数据库软件
- 如何用 Python 生成炫酷二维码
- 一个在交流群里讨论过两轮的问题,答案竟然跟一个 PEP 有关
- Python 函数为什么会默认返回 None?
- 潘粤明的《龙岭迷窟》到底怎么样?我用 Python 得出了一些结论!
- [译]按照EIP-712规范签名完成委托和投票
- 更好Solidity合约调试工具: console.log
- 发现了合自己胃口的公众号,但文章太多翻来翻去真麻烦,还好我学了 Python
- 用 Python 下载抖音无水印视频
- 《民国奇探》的弹幕有点逗比,用 Python 爬下来看看
- MySQL information_schema详解 PARTITIONS
- 如何用 Python 来绘制玫瑰图等常见疫情图