<head>
<meta http-equiv="Content-Type" content="text/html charset=gb2312" />
<title>文哥讨厌IE</title>
<script language="javascript" type="text/javascript">
function checkMobile(str) {
if(str==""){
alert("手机号不能为空！")
}
else{
var re = /^1\d{10}$/
if (re.test(str)) {
alert("正确")
} else {
alert("手机号格式错误！")
}
}
}
</script>
</head>
<body>
<input type="text" id="btn_getNum"/>
<input type="button" value="得到数字" onclick="checkMobile(btn_getNum.value)"/>
</body>
</html>
是的
一、前言
前3篇文章实际都是为本文做铺垫的，如果以下棋表示，前三篇是普通走棋，本篇是将军！
目前市面上有不少表单验证插件，看似强大，实在糟糕！
总结下，有以下一些问题：
过多干预
包括：改变了表单元素UI, 为表单元素绑定过多事件等
布局等限制
包括：需要特定结构的布局，需要特定的类名或者ID
学习成本
包括：N多元作者自定义的属性，或者自定义的特定的数据结构
可用性
当JS出现错误的时候而无法正常运作的时候，验证就是聋子的耳朵——摆设，即使在现代浏览器下也是如此。
面向未来的表单验证
验证驱动
验证信息HTML驱动，例如HTML5中required, pattern, multiple等
验证形式
非即时响应，submit验证，如Chrome浏览器的处理；或者弱即时响应，如FireFox浏览器仅仅红色外发光。
验证交互
浮动形式，尖角指示。
换言之，所谓面向未来的表单验证，是遵循W3C HTML5规范的表单验证，我们可以从目前领先的浏览器中看到大致雏形。而本文所有展示的html5Validate表单验证插件，就是基于这个未来设计的。
二、html5Validate概述
html5Validate插件的验证机制、交互形式甚至形式与Chrome浏览器HTML5表单内置验证走的很近。在使用的时候，就是写写原生的HTML5表单代码。我只想说：走阳光大道和过独木桥的感觉是完全不一样的。
举个简单例子，一个邮箱验证，HTML5代码表示应该是下面这个样子：
<input type="email" required>好巧的是，使用html5Validate进行表单验证的时候，也是使用上面这段HTML代码！
类似下面的绑定：
$("form").html5Validate()于是，您在提交表单的时候会（在各个浏览器下）看到这样子的提示：
跟Chrome浏览器下的提示文字近似：
html5Validate支持我所知的HTML5验证相关的东西，如type="email", type="number", type="tel", type="url", step, min, max, required, pattern, multiple等，并有一些本地化扩展，如增加了type="zipcode"邮编等，支持type="hidden"的完整验证（HTML5中是忽略的），支持多type共存，例如type="email|tel", 可以让文本框输入邮箱或者手机号码。
type="date", type="hour", type="password"等因为不同网站规则不一样，因此，没有放在html5Validate中，不过，您可以很简单地进行扩展，使您的项目支持之，这个后面会介绍（参见 part 9-4）。
为了满足实际开发需求，额外增加了四个自定义属性值：data-key, data-target, data-min, data-max. 具体何用，下面会详细讲解。
支持自动的全角转半角。
注意：type="submit", type="reset", type="file", type="image"以及disabled的表单元素没有验证性可言，因此，下面所说的表单元素，并不包括他们。
兼容性
html5Validate通过jQuery1.4+测试，支持正常IE6-IE10浏览器，FireFox, Chrome等现代浏览器。
在HTML5中内置了很多表单的验证规则，这些验证规则会根据用户在input元素中输入的内容返回一个布尔值来告诉我们表单验证的状态。下面我们就来列举一些我们比较常用的内置验证规则吧：ValueMising规则
示例：<input type="text" required value="" >
目的：确保表单控件(input元素在页面中是以一个控件的形式呈现的)中的值已填写。
用法：在表单控件中将required属性设置为true。因为required属性的默认值为true所以如示例中所示：在input元素中接添加required属性也是可以的。
详细说明：如果表单控件设置了required特性，那么在用户填写或者通过代码调用方式填值之前，控件会一直处于无效状态。例如，在示例中我们设置该控件的值为空，空的文本输入框无法通过必填检查，除非在其中输入任意文本。输入值为空时，valueMissing会返回true。表示没有通过验证。
typeMismatch规则
示例：<input type=“url” value=“miaomiaoxue”/ >
目的：保证控件值与预期类型相匹配(如numbe、email、URL等)。
用法： 指定表单控件的type特性值为numbe、email、URL等规定文本输入规则的类型。
详细说明: 特殊的表单控件类型不只是用来定制手机键盘,如果浏览器能够识别出来表单控件中的输入不符合对应的类型规则,比如email地址中没有@符号，或者number型控件的输入值不是有效的数字，示例中URL型的空间不是一个标准的链接格式。那么浏览器就会把这个控件标记出来以提示类型不匹配。无论哪种出错情况，typeMismatch将返回true。表示没有通过验证。
patternMismatch规则
示例：<input type="text" pattern=“/^[A-z]+$/" value=“1234“/>
目的：根据表单控件上设置的格式规则验证输入的文本是否为有效格式
用法：在表单控件上设置pattern特性，井赋予适当的匹配规则。
详细说明：pattern特性向开发人员提供了一种强大而灵活的方式来为表单的控件值设定正则表达式验证机制。当为控件设置了pattern特性后，只要输入控件的值不符合模式规则，如示例中设定的正则表达式规则该控件的值含有字母和$符号，这里设置的值为1234，不符合规则设定，因此patternMismatch就会返回true值。从引导用户和技术参考两方面考虑，
你应该在包含pattern特性的表单控件中设置title特性以说明规则的作用。
tooLong规则
示例：<input type=“text” maxlength=“3” value=“hello“/ >
目的：避免输入值包含过多字符。
用法：在表单控件上设置maxLength特性。
详细说明：如果输入值的长度超过maxLength，示例中最大限制设置为3，但值为hello，操过了3个字符的限制，tooLong规则就会返回true。虽然表单控件通常会在用户输入时限制最大长度，但在有些情况下，如通过程序设置，还是会超出最大值。
rangeUnderflow规则
示例：<input type=“text” min=“3” max=“5” value=“0" />
目的：限制数值型控件的最小值。
用法：为表单控件设置min属性，并赋予允许的最小值。
详细说明：在需要做数值范围检查的表单控件中，数值很可能会暂时低于设置的下限，如示例中设置的值为0，而设置的min属性为3。此时，rangeUnderflow属性将返回true。
rangeOverflow规则
示例：<input type=“text” min=“3” max=“5” value=“7" />
目的：限制数值型控件的最大值。
用法：为表单控件设置max属性，并赋予允许的最大值。
详细说明：与rangeUnderflow类似，如果一个表单控件的值比max属性值更大，如示例中设置的值为7，而设置的max属性为5。此时，rangeOverflow属性将返回true。
stepMismatch规则
示例：<input type=“text” min=“0” max=“100” step=“5” value=“17" />
目的：确保输入值符合min、max及step即设置。
用法：为表单控件设置step特性，指定数值的增量。
详细说明：此约束条件用来保证数值符合min、max和step的要求。换句话说，当前值必须是最小值与step属性值的倍数之和。如示例中设置的数值范围为0到100，step特性值为5，此时就不允许出现17，而可以是“0+5*X”X为（0~20）中任意一个值皆可。否则stepMismatch返回true值。
valid规则
示例：<input type=“range” min=“5” max=“20” step=“5” value=“10" />
目的：验证表单控件是否满足所有的表单验证规则
用法：适用于所有的input表单控件。
详细说明：当该表单控件满足所有验证规则时，valid属性就是true，否则，只要有一项验证规则没通过，valid属性会返回false。如示例所示就满足所有验证条件所以valid属性会返回true。注意前面几个验证属性是没有通过的情况下返回true。推荐你去教程网站秒秒学上过一遍相关知识，希望对你有帮助。
