jquery常用验证
页面：
View Code
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="验证.aspx.cs" Inherits="验证" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <script src="javsscript/jquery-1.7.1.js" type="text/javascript"></script> <script type="text/javascript" type="text/javascript"> $(document).ready(function() { /*非空验证 $('.error').hide(); $('.submit').click(function(event) { var data = $('.infobox').val(); var len = data.length; if (len < 1) { $('.error').show(); event.preventDefault(); } else { $('.error').hide(); } });*/ /*非空验证 数字验证 数字范围验证 $('.error').hide(); $('.submit').click(function(event) { var data = $('.infobox').val(); var len = data.length; var c; var age = 0; var flag = 0; if (len < 1) { //判断是否为空 $('.error').show(); $('.error').html('不能为空！'); event.preventDefault(); } else { $('.error').hide(); for (var i = 0; i < len; i++) { c = data.charAt(i).charCodeAt(0); if (c == 45 && i == 0) { //可以为负值 continue; } else if (c < 48 || c > 57) { //判断是否为数字 $('.error').show(); $('.error').html('请输入数字！'); event.preventDefault(); flag = 1; break; } else { $('.error').hide(); } } } if (flag == 0) { age = parseInt(data); if (age < 5 || age > 120) {//判断年龄的范围 $('.error').show(); $('.error').text('年龄应在5到120之间！'); event.preventDefault(); } } }); */ /*验证电话号码 示例可以输入0-9的数字、-号、+号。 $('.error').hide(); $('.submit').click(function(event) { var data = $('.infobox').val(); if (validate_phoneno(data)) { $('.error').hide(); } else { $('.error').show(); event.preventDefault(); } }); function validate_phoneno(ph) { var pattern = new RegExp(/^[0-9-+]+$/);//^表示开始 $表示结束 右方括号（])后跟+号，意味着这个模式可以重复一次或多次 return pattern.test(ph); } */ /*验证用户名 示例可以输入0-9的数字、a-z大小写字母、下划线。 $('.error').hide(); $('.submit').click(function(event) { var data = $('.infobox').val(); if (validate_phoneno(data)) { $('.error').hide(); } else { $('.error').show(); event.preventDefault(); } }); function validate_phoneno(ph) { var pattern = new RegExp(/^[0-9a-zA-Z_]+$/); //^表示开始 $表示结束 右方括号（])后跟+号，意味着这个模式可以重复一次或多次 return pattern.test(ph); } */ /*验证日期 格式为：MM/dd/yyyy 或者MM-dd-yyyy $('.error').hide(); $('.submit').click(function(event) { var data = $('.infobox').val(); if (validate_phoneno(data)) { $('.error').hide(); } else { $('.error').show(); event.preventDefault(); } }); function validate_phoneno(ph) { //\b在正则的开始和结尾，表示单词边界，也就是单词必须与模式完全匹配 //\d{1,2}意味着出现1到2位数字 //[\/-]意味着出现符号/或- //\d{4}意味着正好出现4位数字 var pattern = new RegExp(/\b\d{1,2}[\/-]\d{1,2}[\/-]\d{4}\b/); return pattern.test(ph); } */ /*验证邮箱 $('.error').hide(); $('.submit').click(function(event) { var data = $('.infobox').val(); if (validate_phoneno(data)) { $('.error').hide(); } else { $('.error').show(); event.preventDefault(); } }); function validate_phoneno(ph) { //\b在正则的开始和结尾，表示单词边界，也就是单词必须与模式完全匹配 //\d{1,2}意味着出现1到2位数字 //[\/-]意味着出现符号/或- //\d{4}意味着正好出现4位数字 var pattern = new RegExp(/^[\w-]+(\.[\w-]+)*@([\w-]+\.)+[a-zA-Z]+$/); return pattern.test(ph); } */ }); </script> <style type="text/css"> .label { float: left; width: 120px; } .infobox { width: 200px; } .error { color: Red; padding-left: 10px; } .errorage { color: Red; padding-left: 10px; } .submit { margin-left: 125px; margin-top: 10px; } </style> <title>无标题页</title> </head> <body> <form id="form1" runat="server"> <div> <!--非空验证 <span class="label">User ID</span><input class="infobox" type="text" name="userid" /><span class="error">不能为空！</span> <%--<input type="submit" class="submit" value="提交" />--%> <asp:Button runat="server" CssClass="submit" Text="提交" onclick="Unnamed1_Click" /> --> <!--非空验证 数字验证 数字范围验证 <span class="label">年龄：</span><input class="infobox" type="text" name="age" /><span class="error">不能为空！</span> <%--<input type="submit" class="submit" value="提交" />--%> <asp:Button runat="server" CssClass="submit" Text="提交" /> --> <!--验证电话号码 <span class="label">Phone number</span><input class="infobox" type="text" name="userid" /><span class="error">号码验证错误！</span> <%--<input type="submit" class="submit" value="提交" />--%> <asp:Button runat="server" CssClass="submit" Text="提交" /> --> <!--验证用户名 <span class="label">用户名：</span><input class="infobox" type="text" name="userid" /><span class="error">用户名验证错误！</span> <%--<input type="submit" class="submit" value="提交" />--%> <asp:Button ID="Button1" runat="server" CssClass="submit" Text="提交" /> --> <!--验证日期 格式为：MM/dd/yyyy 或者MM-dd-yyyy <span class="label">日期：</span><input class="infobox" type="text" name="userid" /><span class="error">日期验证错误！</span> <%--<input type="submit" class="submit" value="提交" />--%> <asp:Button runat="server" CssClass="submit" Text="提交" /> --> <!--验证邮箱 <span class="label">邮箱：</span><input class="infobox" type="text" name="userid" /><span class="error">邮箱证错误！</span> <%--<input type="submit" class="submit" value="提交" />--%> <asp:Button runat="server" CssClass="submit" Text="提交" /> --> </div> </form> </body> </html>
