<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表单验证DEMO By wangking</title>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/validate.pack.js"></script>
<link href="css/validate.css" rel="stylesheet" type="text/css" />
</head><body>
<h1>JQuery表单验证DEMO</h1>
参与讨论：http://wangking717.javaeye.com/blog/765772
<hr />
<form name="validateForm" action="http://wangking717.javaeye.com/" method="post">
<table width="800" border="0" class="ad" cellpadding="0" cellspacing="1" bgcolor="#999999" id="testTable">
<tr bgcolor="#ffffff">
<td align="right" bgcolor="#EEEEEE" width="150px" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
玩家账号 :
</td>
<td align="left" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
<input name="flightno" type="text" id="flightno" reg="^\w{2}\d+$" /> <span name="easyTip">(游戏商名称[2个字母简写]+用户ID[数字] 如: sd10059)</span>
</td>
</tr>
<tr bgcolor="#ffffff">
<td align="right" bgcolor="#EEEEEE" width="150px" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
中文姓名 :
</td>
<td align="left" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
<input name="floatNum" type="text" id="floatNum" reg="^[\u4e00-\u9fa5]+$" /> <span name="easyTip">(只允许中文字符)</span>
</td>
</tr>
<tr bgcolor="#ffffff">
<td align="right" bgcolor="#EEEEEE" width="150px" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
电话号码 :
</td>
<td align="left" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
<input name="str" type="text" id="str" reg="^\d{3}-\d{8}$|^\d{4}-\d{7}$" /> <span name="easyTip">(国内电话号码，格式: 0832-4405222 或 021-87888822
)</span>
</td>
</tr>
<tr bgcolor="#ffffff">
<td align="right" bgcolor="#EEEEEE" width="150px" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
邮箱地址 :
</td>
<td align="left" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
<input name="groupname" type="text" id="groupname" reg="^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$" tip="" /> <span name="easyTip">(邮箱地址，如wangking717@qq.com)</span>
</td>
</tr>
<tr bgcolor="#ffffff">
<td align="right" bgcolor="#EEEEEE" width="150px" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
网址 :
</td>
<td align="left" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
<input name="time1" type="text" id="time1" reg="^(http|https|ftp)\://[a-zA-Z0-9\-\.]+\.[a-zA-Z]{2,3}(:[a-zA-Z0-9]*)?/?([a-zA-Z0-9\-\._\?\,\'/\\\+&%\$#\=~])*$" /> <span name="easyTip">(URl格式，允许FTP,HTTP,HTTPS)</span>
</td>
</tr>
<tr bgcolor="#ffffff">
<td align="right" bgcolor="#EEEEEE" width="150px" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
图片上传 :
</td>
<td align="left" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
<input name="imgFile" type="file" id="imgFile" reg=".*gif|png$" /> <span name="easyTip">(允许GIF,PNG图片)</span>
</td>
</tr>
<tr bgcolor="#ffffff">
<td align="right" bgcolor="#EEEEEE" width="150px" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
来自哪里 :
</td>
<td align="left" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
<select id="from" name="from" reg="[^0]">
<option value="0">－－请选择你来自哪里－－</option>
<option value="a">北京</option>
<option value="b">上海</option>
<option value="c">四川</option>
</select> <span name="easyTip"></span>
</td>
</tr>
<tr bgcolor="#ffffff">
<td colspan="2" align="left" style="padding-left: 5px; padding-top: 4px; padding-bottom: 4px; padding-right: 18px;">
<input type="submit" name="submit" value=" 提交 " id="submit" />
</td>
</tr>
</table>
</form>
</body>
</html> |
注册 登录
