Validform:
Jquery表單驗證外掛–Validform:一行程式碼搞定整站的表單驗證!
jquery.form.js:
1.
<script src="/js/jquery-1.8.1.min.js"></script>
<script type="text/javascript" src="/js/Validform_v5.3.2_min.js"></script>
<script src="/js/jquery.form.js"></script>
<form action="/union/saveJoin.do" method="post" id="form1" class="registerform">
<table border="0" cellpadding="0" cellspacing="1" width="800" >
<tr>
<td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 姓名 </td>
<td width="600" valign="middle"><input class="shout" type="text" name="username" id="username" datatype="s2-12" errormsg="姓名至少2個字元,最多12個字元!" nullmsg="請填寫姓名!" ></td>
</tr>
<tr>
<td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 手機 </td>
<td width="600" valign="middle"><input class="shout" type="text" name="mobile" id="mobile" datatype="m" errormsg="手機號碼格式不正確!" nullmsg="請填寫手機號碼!"></td>
</tr>
<tr>
<td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 郵箱 </td>
<td width="600" valign="middle"><input type="text" name="email" id="email" datatype="e" errormsg="郵箱格式不正確!" nullmsg="請填寫郵箱!"></td>
</tr>
<tr>
<td width="200" height="40" align="right" valign="middle" style="padding-right: 20px;">* 身份證號 </td>
<td width="600" valign="middle"><input type="text" name="idcard" id="idcard" datatype="*" nullmsg="請填寫身份證號!"></td>
</tr>
<tr>
<td width="200" height="60" align="right" valign="middle" style="padding-right: 20px;"> </td>
<td width="600" valign="middle">
<input class="btn" type="submit" value="提交資料">
</td>
</tr>
</table>
<span id="checkButton"></span>
</form>
JS :
$(function() { $(".registerform").Validform({ btnSubmit:"#checkButton", tiptype:function(msg){ if(msg != ''){ showmsg(msg); } }, tipSweep:true, beforeSubmit:function(){ saveAccount(); return false; } }); }); function saveAccount(){ $("#form1").ajaxSubmit(function(data) { data = eval('(' + data + ')'); if(data.code == 0){ }else if(data.code == -1){ }else{ alert("系統繁忙,請稍後重試!"); } }); return false; }
...