jquery validate 單個校驗+全部校驗
阿新 • • 發佈：2019-01-03
1、引入
<script src="/poobo/js/jquery/jquery-1.8.3.min.js" type="text/javascript"></script>
<script type="text/javascript" src="/poobo/js/jquery/jquery.validate.min.js"></script> 2、頁面form
<%@ page language="java" import="java.util.*" pageEncoding="utf-8" isELIgnored="false"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <%@include file="/poobo/public/common.jspf"%> <title><s:if test="postType=='new'">新增</s:if><s:else>編輯</s:else>商鋪</title> <meta http-equiv="X-UA-Compatible" content="IE=8" /> <link rel="stylesheet" href="/css/jquery/jquery.fileupload-ui.css"> <script src="/js/jquery/jquery.fileupload.js"></script> <script src="/js/jquery/jquery.fileupload-ui.js"></script> <script type="text/javascript" src="/poobo/js/store/store_detail.js"></script> </head> <body> <div class="main"> <div class="mainBox"> <h2><s:if test="postType=='new'">新增</s:if><s:else>編輯</s:else>商鋪</h2> <div class="buyOrderList" style="width:98%; margin: 10px auto 0;"> <!-- 需要提交的表單 start --> <form id="submitForm" name="submitForm" method="POST" enctype="multipart/form-data"> <!-- ************** --> <input type="hidden" name="store.storeType" id="store.storeType" value="<s:property value="store.storeType"/>"> <input type="hidden" name="store.status" id="store.status" value="<s:property value="store.status"/>"> <input type="hidden" name="store.createDate" id="createDate" value="<s:property value="store.createDate"/>"> <input type="hidden" name="postType" id="postType" value="<s:property value="postType"/>"> <input type="hidden" name="store.globalId" id="globalId" value="<s:property value="store.globalId"/>"> <input type="hidden" name="userGlobalId" id="userGlobalId" value="<s:property value="store.user.globalId"/>"> <input id="img1" type="hidden" name="store.picPath" value="<s:property value="store.picPath" />" /> <table width="100%" border="0" cellpadding="3" cellspacing="1"> <tbody> <tr> <td class="left_title_1" width="20%"> 商鋪類別<b> : </b></td> <td class="left_title_4" > <select name="storeCategoryId" style="width:75px;" class="valid"> <option value="1" <s:if test="store.storeCategory.storeCategoryId==1">selected="selected" </s:if>>旅遊</option> <option value="2" <s:if test="store.storeCategory.storeCategoryId==2">selected="selected" </s:if>>餐飲</option> <option value="3" <s:if test="store.storeCategory.storeCategoryId==3">selected="selected" </s:if>>服裝</option> <option value="4" <s:if test="store.storeCategory.storeCategoryId==4">selected="selected" </s:if>>零售</option> <option value="5" <s:if test="store.storeCategory.storeCategoryId==5">selected="selected" </s:if>>教育/培訓</option> <option value="6" <s:if test="store.storeCategory.storeCategoryId==6">selected="selected" </s:if>>賓館</option> <option value="7" <s:if test="store.storeCategory.storeCategoryId==7">selected="selected" </s:if>>體育運動</option> </select> <span class="star">*</span> <span class="tishi"></span> </td> </tr> <!-- <tr> <td class="left_title_1" width="20%"><span class="text-error">* </span>商鋪型別<b> : </b></td> <td class="left_title_4" width="80%"> <input type="radio" name="storeType" value="0" >普通商戶<input type="radio" name="storeType" value="1">運營商商戶 </td> </tr> --> <tr> <td class="left_title_1" width="20%"> 商鋪名稱<b> : </b></td> <td class="left_title_4" width="80%"> <input type="text" id="storeName" name="store.storeName" value="<s:property value="store.storeName" />" size="20" maxlength="40"> <span class="star">*</span> <span class="tishi"></span> </td> </tr> <!-- <tr> <td class="left_title_1"> 所屬區域 <b> : </b></td> <td class="left_title_4">廣東 東莞市</td> </tr> --> <!-- <tr> <td class="left_title_1"><span class="text-error">* </span>詳情<b> : </b></td> <td class="left_title_4"><input type="text" name="storeInfo" id="store_storeInfo"> </td> </tr> --> <tr> <td class="left_title_1"> 聯絡電話<b> : </b></td> <td class="left_title_4"><input type="text" name="store.phone" size="20" maxlength="11" value="<s:property value="store.phone" />" id="store_phone"> <span class="star">*</span> <span class="tishi"></span> </td> </tr> <tr> <td class="left_title_1"> 營業時間<b> : </b></td> <td class="left_title_4"><input type="text" name="store.mainDate" size="20" value="<s:property value="store.mainDate" />" id="mainDate"> <span class="star">*</span> <span class="tishi"></span> </td> </tr> <tr> <td class="left_title_1"> 簡介<b> : </b></td> <td class="left_title_4"> <textarea name="store.storeSampleInfo" class="member-normal-normalarea" style="width:500px;height:50px;"><s:property value="store.storeSampleInfo" /></textarea> <span class="star">*</span> <span class="tishi"></span> </td> </tr> <tr> <td class="left_title_1"> 詳細地址<b> : </b></td> <td class="left_title_4"> <textarea name="store.address" class="member-normal-normalarea" style="width:500px;height:50px;"><s:property value="store.address" /></textarea> <span class="star">*</span> <span class="tishi"></span> <span class="help-block">為了客戶能準確找到您的店鋪，請按照格式填寫：_省_市_縣（區）_ </span> </td> </tr> <tr> <td class="left_title_1"> 最高額度<b> : </b></td> <td class="left_title_4"> <%-- <input type="text" name="store.storeAccount.limitMoney" value="<s:property value="store.storeAccount.limitMoney"/>" <s:if test="postType=='update'">readonly="readonly"</s:if> size="20" id="limitMoney"/> --%> <s:if test="postType=='new'"> <input type="text" name="store.storeAccount.limitMoney" size="20" id="limitMoney"/> <span class="star">*</span> <span class="tishi"></span> </s:if> <s:else> <span><s:property value="store.storeAccount.limitMoney"/></span> </s:else> </td> </tr> <tr> <td class="left_title_1"> 地圖示記<b> : </b></td> <td class="left_title_4"><span id="spanIsShow" style="color:blue; font-size:12px;">【地圖幫助】</span> <div id="divIntro"> <p>1：滑鼠滾輪可以控制地圖的放大和縮小</p> <p> 2：紅色標記為商鋪當前位置，可以通過<span style="color:red;">滑鼠拖拽和點選來指定新的位置</span> </p> <p> 3：搜尋框可以通過名稱快速定位 ,方便您定位自己的商鋪位置 <input id="txtSearch" type="text"><input type="button" value="GO" onclick="searchKeyMap()"> </p> <p> 4：手動輸入商鋪位置 ,經度：<input name="store.mapLat" id="mapLat" type="text" style="width:120px" value="<s:property value="store.mapLat" />"> 緯度：<input name="store.mapLng" id="mapLng" type="text" style="width:120px" value="<s:property value="store.mapLng" />"> </p> </div> <div class="map" id="map_canvas" style="width: 600px; height: 400px; overflow: hidden; position: relative; z-index: 0; color: rgb(0, 0, 0); text-align: left; background-image: url(http://api.map.baidu.com/images/bg.png);"><div id="platform" style="overflow: visible; position: absolute; z-index: 0; left: 0px; top: 0px; cursor: url(http://api.map.baidu.com/images/openhand.cur) 8 8, default;"><div style="position: absolute; z-index: -1; left: 300px; top: 200px; display: block;"><img src="http://online2.map.bdimg.com/tile/?qt=tile&x=1610&y=277&z=13&styles=pl&udt=20140928" style="position: absolute; border: none; width: 512px; height: 512px; left: -774px; top: -701px;"><img src="http://online2.map.bdimg.com/tile/?qt=tile&x=1611&y=276&z=13&styles=pl&udt=20140928" style="position: absolute; border: none; width: 512px; height: 512px; left: -262px; top: -189px;"><img src="http://online2.map.bdimg.com/tile/?qt=tile&x=1612&y=275&z=13&styles=pl&udt=20140928" style="position: absolute; border: none; width: 512px; height: 512px; left: 250px; top: 323px;"><img src="http://online1.map.bdimg.com/tile/?qt=tile&x=1611&y=275&z=13&styles=pl&udt=20140928" style="position: absolute; border: none; width: 512px; height: 512px; left: -262px; top: 323px;"><img src="http://online1.map.bdimg.com/tile/?qt=tile&x=1609&y=277&z=13&styles=pl&udt=20140928" style="position: absolute; border: none; width: 512px; height: 512px; left: -1286px; top: -701px;"></div><div id="mask" class=" BMap_mask" style="position: absolute; left: 0px; top: 0px; z-index: 9; overflow: hidden; -webkit-user-select: none; width: 600px; height: 400px;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 200;"><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 800;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 700;"><span class="BMap_Marker BMap_noprint" unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; cursor: pointer; width: 23px; height: 25px; left: -32551px; top: -20471px; z-index: -4568906; background: url(http://api.map.baidu.com/images/blank.gif);" title=""></span></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 600;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 500;"></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 400;"><span class="BMap_Marker" unselectable="on" style="position: absolute; padding: 0px; margin: 0px; border: 0px; width: 0px; height: 0px; left: -32541px; top: -20446px; z-index: -4568906;"><div style="position: absolute; margin: 0px; padding: 0px; width: 23px; height: 25px; left: -10px; top: -25px; overflow: hidden;"><img src="http://api.map.baidu.com/images/marker_red.png" style="border:none;left:0px; top:0px; position:absolute;"></div></span></div><div style="position: absolute; height: 0px; width: 0px; left: 0px; top: 0px; z-index: 200;"></div></div><div style="position: absolute; z-index: -1; left: 300px; top: 200px;"><img src="http://online1.map.bdimg.com/tile/?qt=tile&x=3222&y=554&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -263px; top: -446px;"><img src="http://online2.map.bdimg.com/tile/?qt=tile&x=3223&y=554&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -7px; top: -446px;"><img src="http://online0.map.bdimg.com/tile/?qt=tile&x=3223&y=552&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -7px; top: 66px;"><img src="http://online2.map.bdimg.com/tile/?qt=tile&x=3224&y=553&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: 249px; top: -190px;"><img src="http://online0.map.bdimg.com/tile/?qt=tile&x=3222&y=553&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -263px; top: -190px;"><img src="http://online1.map.bdimg.com/tile/?qt=tile&x=3224&y=552&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: 249px; top: 66px;"><img src="http://online4.map.bdimg.com/tile/?qt=tile&x=3222&y=552&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -263px; top: 66px;"><img src="http://online1.map.bdimg.com/tile/?qt=tile&x=3223&y=553&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -7px; top: -190px;"><img src="http://online0.map.bdimg.com/tile/?qt=tile&x=3221&y=554&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -519px; top: -446px;"><img src="http://online3.map.bdimg.com/tile/?qt=tile&x=3221&y=552&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -519px; top: 66px;"><img src="http://online3.map.bdimg.com/tile/?qt=tile&x=3224&y=554&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: 249px; top: -446px;"><img src="http://online4.map.bdimg.com/tile/?qt=tile&x=3221&y=553&z=14&styles=pl&udt=20140928" style="position: absolute; border: none; width: 256px; height: 256px; left: -519px; top: -190px;"></div></div><div id="zoomer" style="position: absolute; z-index: 0; top: -42.5px; left: 476px; overflow: hidden; visibility: hidden; cursor: url(http://api.map.baidu.com/images/openhand.cur) 8 8, default; width: 120px; height: 91px;"><div class="BMap_zoomer" style="top: 0px; left: 0px; background-position: 0px 0px;"></div><div class="BMap_zoomer" style="top: 0px; right: 0px; background-position: -7px 0px;"></div><div class="BMap_zoomer" style="bottom: 0px; left: 0px; background-position: 0px -7px;"></div><div class="BMap_zoomer" style="bottom: 0px; right: 0px; background-position: -7px -7px;"></div></div><div class=" anchorBL" style="height: 32px; position: absolute; z-index: 10; bottom: 0px; right: auto; top: auto; left: 1px;"><a title="到百度地圖首頁" target="_blank" href="http://map.baidu.com/?sr=1" style="outline: none;"><img style="border:none;width:77px;height:32px" src="http://api.map.baidu.com/images/copyright_logo.png"></a></div><div unselectable="on" class=" BMap_cpyCtrl anchorBL" style="cursor: default; white-space: nowrap; bottom: 2px; right: auto; top: auto; left: 81px; position: absolute; z-index: 10;"><span style="color: rgb(0, 0, 0); font-style: normal; font-variant: normal; font-weight: normal; font-size: 11px; line-height: normal; font-family: arial, simsun; display: inline; background: none;" _cid="1">© 2015 Baidu</span></div><div unselectable="on" class=" BMap_stdMpCtrl BMap_stdMpType0 BMap_noprint anchorTL" style="width: 52px; height: 226px; bottom: auto; right: auto; top: 10px; left: 10px; position: absolute; z-index: 1100;"><div class="BMap_stdMpPan"><div class="BMap_button BMap_panN" title="向上平移"></div><div class="BMap_button BMap_panW" title="向左平移"></div><div class="BMap_button BMap_panE" title="向右平移"></div><div class="BMap_button BMap_panS" title="向下平移"></div><div class="BMap_stdMpPanBg BMap_smcbg"></div></div><div class="BMap_stdMpZoom" style="height: 167px; width: 52px;"><div style="height: 167px; width: 37px;"><div class="BMap_button BMap_stdMpZoomIn" title="放大一級"><div class="BMap_smcbg"></div></div><div class="BMap_button BMap_stdMpZoomOut" title="縮小一級"><div class="BMap_smcbg"></div></div></div><div class="BMap_stdMpSlider" style="height: 133px;"><div class="BMap_stdMpSliderBgTop" style="height: 124px;"><div class="BMap_smcbg"></div></div><div class="BMap_stdMpSliderBgBot" style="top: 124px;"><div class="BMap_smcbg"></div></div><div class="BMap_stdMpSliderMask" title="放置到此級別"></div><div class="BMap_stdMpSliderBar" title="拖動縮放" style="cursor: url(http://api.map.baidu.com/images/openhand.cur) 8 8, default; top: 29px;"><div class="BMap_smcbg"></div></div></div><div class="BMap_zlHolder"><div class="BMap_zlSt"><div class="BMap_smcbg"></div></div><div class="BMap_zlCity"><div class="BMap_smcbg"></div></div><div class="BMap_zlProv"><div class="BMap_smcbg"></div></div><div class="BMap_zlCountry"><div class="BMap_smcbg"></div></div></div></div></div><div unselectable="on" class=" BMap_scaleCtrl BMap_noprint anchorBL" style="bottom: 18px; right: auto; top: auto; left: 81px; width: 69px; position: absolute; z-index: 10;"><div class="BMap_scaleTxt" unselectable="on">1 公里</div><div class="BMap_scaleBar BMap_scaleHBar"><img style="border:none" src="http://api.map.baidu.com/images/mapctrls11.png"></div><div class="BMap_scaleBar BMap_scaleLBar"><img style="border:none" src="http://api.map.baidu.com/images/mapctrls11.png"></div><div class="BMap_scaleBar BMap_scaleRBar"><img style="border:none" src="http://api.map.baidu.com/images/mapctrls11.png"></div></div></div></td> </tr> </tbody> </table> <!-- ***************** --> </form> <!-- 需要提交的表單 end --> <!-- 上傳圖片 start--> <table width="100%" border="0" cellpadding="3" cellspacing="1"> <tr> <td class="left_title_1" width="20%"><span class="text-error">* </span>商鋪圖片：</td > <td class="left_title_4" width="80%"> <div> <ul> <li class="list-item"> <div class="kevin-photo"> <a href="javascript:;"> <span id="s1"></span> </a> </div> <form class="upload" action="/poobo/admin/fileUpload.jspx" method="POST" enctype="multipart/form-data" style="width:130px;"> <input type="hidden" name="number" value="1" /> <input type="hidden" name="path" value="store" /> <input type="hidden" name="isNull" value="<s:property value='picPath'/>"/> <input id="1" type="file" name="imgFile"> <button>Upload</button> <div>上傳圖片</div> </form> </li> </ul> </div> <span id="msg1"></span> </td> </tr> <tr><td class="left_title_3"></td><td class="left_title_4"><basefont size="2" color="#e56600">圖片大小應小於500k,如果圖片大於500k,請截圖縮減圖片大小,建議尺寸：400*250!!</td></tr> </table> <!-- 上傳圖片 end--> <div style="padding-left:45%;"> <input type="button" class="selectBtn80" value="提交" id="submitBtn" /> </div> </div> </div> </div> <script type="text/javascript" > var mapLng; var mapLat; $(function($){ mapLng= $("#mapLng").val(); mapLat= $("#mapLat").val(); if(""==mapLng||""==mapLat){ var myCity = new BMap.LocalCity(); myCity.get(myFun); }else{ drawMap(mapLng,mapLat,16); } }); var city = new BMap.LocalSearch(map,{renderOptions:{map:map,autoViewport:true}}); /*地圖顯示到查詢結果處*/ function searchKeyMap(){ var s = $("#txtSearch").val(); if(s==""||s==null) { alert("請輸入搜尋地區!"); return false; }else{ city.search(s); } } function myFun(result){ mapLng=result.center.lng; mapLat=result.center.lat; drawMap(mapLng,mapLat,12); } function drawMap(mapLng,mapLat,level){ var map = new BMap.Map("map_canvas"); /* 建立地圖例項 */ var point = new BMap.Point(mapLng,mapLat); /* 建立點座標 */ map.centerAndZoom(point, level); /* 初始化地圖，設定中心點座標和地圖級別 */ map.addControl(new BMap.NavigationControl()); /*新增魚骨控制元件*/ map.addControl(new BMap.ScaleControl());/*比例尺*/ map.enableScrollWheelZoom(); /* 開啟滑鼠滾輪縮放 */ map.enableKeyboard(); /* 開啟鍵盤控制 */ map.enableContinuousZoom(); /* 開啟連續縮放效果 */ map.enableInertialDragging(); /* 開啟慣性拖拽效果 */ var marker1 = new BMap.Marker(point); /* 建立標註*/ map.addOverlay(marker1); /* 將標註新增到地圖中*/ marker1.enableDragging(true); /* 設定標註可拖拽*/ marker1.addEventListener("dragend", function(){ var center=marker1.getPoint(); $("#mapLng").val(center.lng); $("#mapLat").val(center.lat); }); map.addEventListener("click", function (e) { map.clearOverlays(); point = new BMap.Point(e.point.lng, e.point.lat); $("#mapLng").val(e.point.lng); $("#mapLat").val(e.point.lat); var marker = new BMap.Marker(point); map.addOverlay(marker); marker.enableDragging(true); /* 設定標註可拖拽*/ marker.addEventListener("dragend", function(){ var center=marker.getPoint(); $("#mapLng").val(center.lng); $("#mapLat").val(center.lat); }); }); } </script> </body> </html>
3、js
//提交表單 function ajaxSubmitForm(){ $.ajax({ type : "POST", url : "poobo/store/saveStore.jspx", data : $("#submitForm").serialize(), dataType : "json", success : function(data) { if (data.flag) { // 成功 showSuccessMsg(data.msg, 2);// 提示成功，2秒鐘關閉 //載入列表頁面 $(".container").load("poobo/store/toStoreList.jspx"); }else{ //失敗 showFailureMsg(data.msg, 1);// 提示成功，2秒鐘關閉 } } }); } $(function($) {//頁面載入完成事件 //////////////////////////驗證表單////////////////////////////////////////////////////////// $("#submitForm").validate({ rules : { "store.storeName":{//登入名 required : true, minlength:2, maxlength:40, isName:true }, "store.phone":{//電話 required : true, isMobile:true } ,"store.mainDate":{//營業時間 required : true, minlength:2, maxlength:200 } ,"store.storeSampleInfo":{//簡介 required : true, minlength:2, maxlength:1000 } ,"store.address":{//地址 required : true, minlength:2, maxlength:100 } ,"store.storeAccount.limitMoney":{//額度 isMoney:true } }, //驗證結果 messages : { "store.storeName":{ required : "請填寫使用者名稱", minlength:"使用者名稱不能少於2個字元", maxlength:"使用者名稱不能超過40個字元", isName : "使用者名稱必須為數字、字母、下劃線及其組合" }, "store.phone":{//電話 required : "請填寫電話", isMobile:"手機號格式錯誤" },"store.mainDate":{//營業時間 required : "營業時間必填", minlength:"至少2個字元", maxlength:"最多200個字元" } ,"store.storeSampleInfo":{//簡介 required : "簡介必填", minlength:"至少2個字元", maxlength:"最多1000個字元" } ,"store.address":{//地址 required : "地址必填", minlength:"至少2個字元", maxlength:"最多100個字元" } ,"store.storeAccount.limitMoney":{//額度 isMoney:"必須為整數" } } , submitHandler : function(form) { ajaxSubmitForm(); }, success : function(label) { label.addClass("success").text("輸入正確"); }, errorPlacement : function(error, element) { error.appendTo(element.next("span").next("span")); }, onkeyup : false }); /////////////////////////////////////////////////////////////////////////////////////////////////////// ////////////////////提交按鈕/////////////////////////////////////////////////////////////////////////////////// $("#submitBtn").click(function(){ $("#submitForm").submit(); }); /////////////////////////////////////////////////////////////////////////////////////////////////////// /*商鋪圖片上傳初始化*/ $('.upload').fileUploadUI({ buildDownloadRow: function (file) { /*記錄上傳的圖片的集合*/ var fileUploadPic=$("#fileUploadPic").val(); if(fileUploadPic==""){ //fileUploadPic=file.name+","; fileUploadPic=file.name; $("#fileUploadPic").val(fileUploadPic); }else{ //fileUploadPic=file.name+","; fileUploadPic=file.name; $("#fileUploadPic").val(fileUploadPic); } var id="#s"+file.number; var imgId="#img"+file.number; if(file.status=="0" && file.number == 1){ $(id).html("<img src='/img/store/original_copy/"+file.name+"' style=\"width:110px;height:110px;\"\/>"); $(imgId).val(file.name); } else{ alert(file.message); $(id).html(""); $(imgId).val(""); } }, beforeSend: function (event, files, index, xhr, handler, callBack) { var file=files[index]; var regexp = /\.(png)|(jpg)|(gif)|(jpeg)$/i; var id="#s"+$(this.uploadForm.prevObject).attr("id"); if(!regexp.test(file.name)){ alert("請選擇一個圖片檔案"); return; } if(file.fileSize>=512000 || file.size > 512000) { alert("圖片請不要超過500k"); return; } $(id).html("<img id='image1' src='/css/jquery/loading.gif' \/>"); callBack(); }, onError: function (event, files, index, xhr, handler) { var id="#s"+$(this.uploadForm.prevObject).attr("id"); var imgId="#img"+$(this.uploadForm.prevObject).attr("id"); if (handler.originalEvent) { $(id).html(""); $(imgId).val(""); alert("圖片請不要超過500k"); }else{ $(id).html(""); $(imgId).val(""); alert("抱歉，伺服器不能響應您的請求，請稍後再試"); } } }); /*商品圖片設定*/ setPics(); }); ////////////////////////////////////////////////////////////////////////////////////////////// function setPics(){//2015.03.31載入原先的頭像 var path=$("#img1").val(); var picPath = "/img/store/original_copy/"+path+"?temp="+Math.random(); var id="#s1"; if(path == null || path == ''){ $(id).html("<img src='/poobo/img/default_pic.jpg' style=\"width:110px;height:110px;\"\/>"); $("#img1").val("default_pic.jpg"); return ; } $(id).html("<img src='"+picPath+"' style=\"width:110px;height:110px;\"\/>"); $("#originalPic").val(path); } //////////////////////////////////////////////////////////////////////////////////////////////
4、自定義校驗方法
jQuery.validator.addMethod("isMobile", function(value, element) { var length = value.length; var mobile = /^(1+(3|4|5|7|8|9)+\d{9})$/; return this.optional(element) || (length == 11 && mobile.test(value)); }, "請正確填寫您的手機號碼"); jQuery.validator.addMethod("isName", function(value, element) { var name = /^[\u0391-\uFFE5\w]{2,30}$/; return this.optional(element) || (name.test(value)); }, "請正確填寫名稱"); jQuery.validator.addMethod("isMoney", function(value, element) { var reg = /^[0-9]+([.]{1}[0-9]{1,2})?$/; return this.optional(element) || (reg.test(value)); }, "請正確填寫金額"); jQuery.validator.addMethod("notZero", function(value, element) { var flag=false; if(value>0){ flag=true; } return this.optional(element) || (flag); }, "填寫值必須大於零");