JS验证表单项
之前网上搜索了些JS表单验证插件,发现都必须是在FORM表单里验证,对于一些AJAX的表单保存不适合,于是自己写了一个
<script type="text/javascript" src="./jquery-1.4.2.min.js"></script> <script type="text/javascript"> <!-- function check_data_type(){ var AllErrorMsg = ''; $("#check_date_form").find(".checkdate").each(function(i){ var ckdate= new Array(); var pattern; var v = $(this).val(); var ckdate = $(this).attr("ckdate").split(","); var datetype = ckdate[0]; var errormsg = ckdate[1]; var ck = ckdate[2]; switch(datetype){ case 'Require' : pattern = /.+/;break; case 'Mobile' : pattern = /^1[0-9][0-9]\d{4,8}$/;break; case 'Tel' : pattern = /^\d+-\d+$/;break; case 'Email' : pattern = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;break; case 'Url' : pattern = /^http:\/\/[A-Za-z0-9]+\.[A-Za-z0-9]+[\/=\?%\-&_~`@[\]\':+!]*([^<>\"\"])*$/;break; case 'Number' : pattern = /^\d+$/;break; case 'Integer' : pattern = /^[-\+]?\d+$/;break; case 'Double' : pattern = /^[-\+]?\d+(\.\d+)?$/;break; case 'English' : pattern = /^[A-Za-z]+$/;break; case 'Chinese' : pattern = /^[\u0391-\uFFE5]+$/;break; default : pattern = /.+/; } if(ck == "0"){ if(v != ''){ rst = pattern.exec(v); if(!rst){ AllErrorMsg = AllErrorMsg + errormsg + "\n"; } } }else{ rst = pattern.exec(v); if(!rst){ AllErrorMsg = AllErrorMsg + errormsg + "\n"; } } }); if(AllErrorMsg != ''){ alert(AllErrorMsg); return false; }else{ return true; } } function save(){ if(!check_data_type()){ return false; } } //--> </script> <!-- 1、需引用JQ核心文件,如:jquery-1.4.2.min.js 2、定义需验证表单项的容器 id=check_date_form 3、class="checkdate" 标记需要验证表单 4、ckdate="Mobile,手机号格式不正确,0" 对应解释 ckdate="[验证规则],[验证错误提示],[0表示填写了数据才验证,为空时不验证]" --> <table id="check_date_form"> <tr> <td colspan="4">标题: <input type="text" name="tender_title" id="tender_title" class="checkdate" value="" ckdate="Require,标题不能为空"/> </td> </tr> <tr> <td>手机:</td> <td><input type="text" name="mob" id="mob" value="" class="checkdate" ckdate="Mobile,手机号格式不正确,0"/></td> <td>固定电话:</td> <td><input type="text" name="tel" id="tel" value="" class="checkdate" ckdate="Tel,固定电话格式不正确,0"/></td> </tr> <tr> <td>QQ:</td> <td><input type="text" name="qq" id="qq" value="" class="checkdate" ckdate="Number,QQ号格式不正确,0"/></td> <td>邮箱:</td> <td><input type="text" name="email" id="email" value="" class="checkdate" ckdate="Email,邮箱格式不正确,0"/></td> </tr> <tr> <td colspan="4"> <input type="button" value="保存" onclick="save();" /> </td> </tr> </table>