Jquery表单验证
Posted 戳记
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Jquery表单验证相关的知识，希望对你有一定的参考价值。
.代码中添加引用（必备引用）
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script> <!--jquery必须库--> <script src="formValidator1/formValidator-4.0.1.min.js" type="text/javascript"></script> <!--表单验证必须库--> <script src="formValidator1/formValidatorRegex.js" type="text/javascript"></script> <!--表单验证扩展库--> <link href="formValidator1/style/validator.css" rel="stylesheet" type="text/css" /><!--表单验证样式表-->
3.<body>中要验证的标签（做一些常用的演示）
<table border="0px" style="font-size:12px">
<tr>
<td colpan="3"><input type="submit" name="button" id="button" value="提交" /></td>
</tr>
<tr>
<td align="right">身份证(正则表达式库):</td>
<td><input name="sfz" type="text" id="sfz" /></td>
<td><div id="sfzTip" style="width:300px"></div></td> <!--必须注意这里提示验证信息中的div的id值，跟要验证控件中的id值多了一个Tip，下面的都是这样。必须多的是Tip，也必须要多。-->
</tr>
<tr>
<td align="right">身份证(外部函数):</td>
<td><input type="text" id="sfz1" style="width:120px" /></td>
<td><div id="sfz1Tip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">整数:</td>
<td><input type="text" id="zs" style="width:120px" /></td>
<td><div id="zsTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">正整数:</td>
<td><input type="text" id="zzs" style="width:120px" /></td>
<td><div id="zzsTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">负整数:</td>
<td><input type="text" id="fzs" style="width:120px" /></td>
<td><div id="fzsTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">数字:</td>
<td><input type="text" id="sz" style="width:120px" /></td>
<td><div id="szTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">正数（正整数 + 0）:</td>
<td><input type="text" id="zs1" style="width:120px" /></td>
<td><div id="zs1Tip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">负数（负整数 + 0）:</td>
<td><input type="text" id="fs" style="width:120px" /></td>
<td><div id="fsTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">浮点数:</td>
<td><input type="text" id="fds" style="width:120px" /></td>
<td><div id="fdsTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">正浮点数:</td>
<td><input type="text" id="zfds" style="width:120px" /></td>
<td><div id="zfdsTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">负浮点数:</td>
<td><input type="text" id="ffds" style="width:120px" /></td>
<td><div id="ffdsTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">非负浮点数（正浮点数 + 0）:</td>
<td><input type="text" id="fffds" style="width:120px" /></td>
<td><div id="fffdsTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">非正浮点数（负浮点数 + 0）:</td>
<td><input type="text" id="fzfds" style="width:120px" /></td>
<td><div id="fzfdsTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">颜色:</td>
<td><input type="text" id="ys" style="width:120px" /></td>
<td><div id="ysTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">你的EMAIL:</td>
<td><input type="text" id="email" style="width:120px" /></td>
<td><div id="emailTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">手机:</td>
<td><input type="text" id="sj" style="width:120px" /></td>
<td><div id="sjTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">邮编:</td>
<td><input type="text" id="yb" style="width:120px" /></td>
<td><div id="ybTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">非空:</td>
<td><input type="text" id="fk" style="width:120px" /></td>
<td><div id="fkTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">图片:</td>
<td><input type="text" id="tp" style="width:120px" /></td>
<td><div id="tpTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">压缩文件:</td>
<td><input type="text" id="rar" style="width:120px" /></td>
<td><div id="rarTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">ip4:</td>
<td><input type="text" id="ip4" style="width:120px" /></td>
<td><div id="ip4Tip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">QQ号码:</td>
<td><input type="text" id="qq" style="width:120px" /></td>
<td><div id="qqTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">国内电话:</td>
<td><input type="text" id="dh" style="width:120px" /></td>
<td><div id="dhTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">用户名:</td>
<td><input type="text" id="yhm" style="width:120px" /></td>
<td><div id="yhmTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">字母:</td>
<td><input type="text" id="zm" style="width:120px" /></td>
<td><div id="zmTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">大写字母:</td>
<td><input type="text" id="dxzm" style="width:120px" /></td>
<td><div id="dxzmTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">小写字母:</td>
<td><input type="text" id="xxzm" style="width:120px" /></td>
<td><div id="xxzmTip" style="width:300px"></div></td>
</tr>
<tr>
<td align="right">身份证:</td>
<td><input type="text" id="sfz" style="width:120px" /></td>
<td><div id="sfzTip" style="width:300px"></div></td>
</tr>
</table>
以上是关于Jquery表单验证的主要内容，如果未能解决你的问题，请参考以下文章