html5正则校验触发正则表单验证web

【HTML5】增强型表单标签

name：标识表单提交时的key值 min：标识当前输入框输入的最小值 max：标识当前输入框输入的最大值 step：标识点击增大/减小的时候，增加/减小的步长当表单在提交前，此文本框会自动校验是否符合邮箱的正则表达式。

创新互联专业为企业提供万源网站建设、万源做网站、万源网站设计、万源网站制作等企业网站建设、网页设计与制作、万源企业网站模板建站服务，10多年万源做网站经验，不只是建网站，更提供有价值的思路和整体网络服务。

canvas 新元素 canvas 标签定义图形，比如图表和其他图像。

/form 1 2 3 4 5 progress代表进度条，表示任务过程，属性有max（任务总量）\value。datalist为Input标记定义一个下拉列表，配合option标签。

HTML5废除了一些旧标签废除的大部分是网页美化方面的标签，例如：big、u、font、basefont、center、s、tt。对frame框架，不能使用。

中使用的常见“文本”输入到属于HTML5的一些新输入类型。keygen：此标记创建用于表单的密钥对生成器字段。1link：不要与“超链接”或锚点（a）标签混淆，此链接用于设置文档与外部资源之间的链接。

html5新增的表单元素有以下几种：datalist，keygen，output三种无素。datalist 元素 datalist 元素规定输入域的选项列表。列表是通过 datalist 内的 option 元素创建的。

新增表单属性，如：placehoder 属性，简短的提示在用户输入值前会显示在输入域上。即我们常见的输入框默认提示，在用户输入后消失。

有这些新属性，placeholder和maxlength用的比较多。

1、`form name=form1 id=f2 action= method=post`：这是HTML表单标签，用于收集用户输入的数据。当用户点击确认添加按钮时，会触发JavaScript的dosubmit函数，提交表单。

2、下面是js中正则表达式的基本用法：/^\w+$/.test(jim2012)；jim2012.match(/^\w+$/)；在用户提交表单时，会触发表单的submit事件。可以利用这个事件，在提交表单前验证表单数据，决定是否提交表单。

3、首先我们要设置表单的验证规则然后根据表单的验证规则定义要显示验证消息，最后通过JavaScript 和CSS相结合先将所有预定义的验证消息隐藏掉，然后再根据表单中的输入是否符合验证规则来控制验证消息的显隐状态。

4、HTML5自带的两种验证方式：l通过required属性校验输入框填写内容不能为空，如果为空将弹出提示框，并阻止表单提交。通过pattern属性规定用于验证input域的模式（pattern），它接受一个正则表达式。

5、js获取表单数据，根据实际情况判断是否符合规则。一般的判断是否为空，是否含有不安全字符，有就过滤掉(这一步也可以在后台处理)。对于未通过的输入，向用户返回信息提示。验证通过，提交数据到后台。

当前文章：html5正则校验触发正则表单验证web
标题路径：http://shouzuofang.com/article/diehcdc.html