私は最近プロジェクトを行っていないので、余暇があります。編集者は、日常生活で一般的に使用されるJSフォーム検証コードを整理し、誰もが学習できるようにWulinネットワークプラットフォームで共有しました。それを必要とする友達のためには、それを参照してください!
登録確認:
<スクリプト言語= "javascript" src = "js/jquery-1.9.1.min.js" type = "text/javascript"> </scrip> // form function function vailform(){var form = jQuery( "#editform"); if(!vailnickname())return; if(!vailphone())return; if(!vailpwd())return; if(!vailconfirmpwd())return; if(!vailemail())return; if(!vailcode()return; if Nickname function vailnickname(){var nickname = jquery( "#nickname")。val(); var flag = false; var message = ""; var patrn =/^/d+$/; var length = getnicknameLenge(); if(nickname == ''){message = "nickname =" old <4 4-16文字! ";} else if(checknicknameisexist()){message ="ニックネームはすでに存在します、再入力してください! ";} else {flag = true;} if(!flag){jquery("#nicknamediv ")。removeclass()。 has-error "); jQuery("#nicknamep ")。html(" "); jquery("#nicknamep ")。html(" <i class =/"icon-error ui-margin-right10/"> <// i>"+message); // jquery( "#nickname")。focus();} else {jquery( "#nicknamediv")。removeclass() has-success "); jquery("#nicknamep ")。html(" "); jquery("#nicknamep ")。html(" <i class =/"icon-success ui-margin-right10/"> <// i>このnicknameが利用可能です ");} jQuery( "#nickname")。val(); var len = 0; //関数形式:Stringobj.match(rgexp)Stringobjは文字列であり、RGEXPは正規表現です// return値:結果配列を返すことができます。ニックネームが存在するかどうかchecknicknameisexist(){var nickname = jquery( "#nickname")。val(); var flag = false; jquery.ajax({url: "checknickname?t =" +(new date())。gettime()、data:{nickname:nickname}、datatype: "json"、type: "get"、async:false、success(data){var status = data.status; if(status == "1"){flag = true;}}}) jQuery( "#phone")。val(); var flag = false; var message = ""; // var myreg =/^(((13 [0-9] {1})| 159 | 153)+/d {8})$/; var myreg = /^((((13 [0-9] {1})|(14 [0-9] {1})|(17 [0-9] {1})|(15 [0-3] {1})|(15 [5-9 ] {1})|(18 [0-3] {1})|(18 [5-9] {1})|(18 [5-9] {1})+/d {8})$/; if(電話== ''){message = "携帯電話番号は空になりません!";} else if(phone.length!= 11){message = "pleate boffore phone number!";} else if(checkphoneisexist()){message = "beal boild phone number!";} else if(checkphoneisexist()) true;} if(!flag){jquery( "#phonediv")。removeclass()。addclass( "ui-form-item has-error"); jquery( "#phonep")。html( ""); jquery( "#phonep") ui-margin-right10/"> <// i>"+message); // jquery( "#phone")。focus();} else {jquery( "#phonediv")。removeclass()。addclass( "ui-form-item has-success "); jQuery("#phonep ")。html(" "); jquery("#phonep ")。html(" <i class =/"icon-margin-right10/"> <// i>この携帯電話番号が利用可能です ");} jQuery( "#phone")。val(); var flag = true; jquery.ajax({url: "checkphone?t =" +(new date())。 FALSE;}}} 6-16ビット! ";} else if(patrn.test(password)){message =" passwordはすべての数字ではない! ";} else {flag = true;} if(!flag){jquery("#passworddiv ")。removeclass()。 has-error "); jQuery("#passwordp ")。html(" "); jquery("#passwordp ")。html(" <i class =/"icon-error ui-margin-right10/"> <// i>"+message); // jQuery( "#password")。focus();} else {jquery( "#passworddiv")。removeclass()。addclass( "ui-form-item has-success "); jquery("#passwordp ")。html(" "); jquery("#passwordp ")。html(" <i class =/"icon-success ui-margin-right10/"> <// i>このパスワードは利用可能です ");} jQuery( "#confism_password")。val(); var patrn =/^/d+$/; var password = jquery( "#password")。val(); var flag = false; var message = ""; if(cundilepassword == ''){メッセージ= "再入力! ";} else if(patrn.test(password)){message ="パスワードはすべての数字になり得ません! "; has-error "); jquery("#confismpasswordp ")。html(" "); jquery("#cundibuspasswordp ")。html(" <i class =/"icon-error ui-margin-right10/"> <// i>"+message); // jquery( "#confism_password")。focus();} else {jquery( "#confisonpassworddiv")。removeclass()。addclass( "ui-form-item has-success "); jQuery("#cundilepasswordp ")。html(" "); jquery("#cundilepasswordp ")。html(" <i class =/"icon-sucsess ui-margin-right10/"> <// i>パスワードを返します;} jQuery( "#email")。val(); var flag = false; var message = ""; var myreg = /^( [/.a-za-z0-9_-] if(email == ''){message = "電子メールは空になりません!";} else if(!myreg.test(email)){message = "有効な電子メールアドレスを入力してください!";} else if(checkemailisexist()){message = "この電子メールアドレスが登録されています!} true;} if(!flag){jQuery( "#emaildiv")。removeclass()。addclass( "ui-form-item has-error"); jquery( "#emailp")。html( ""); jquery( "#emailp") ui-margin-right10/"> <// i>"+message); // jquery( "#email")。focus();} els {jquery( "#emaildiv")。removeclass()。addclass( "ui-form-item has-success "); jquery("#emailp ")。html(" "); jquery("#emailp ")。html(" <i class =/"icon-margin-right10/"> <// i>このメールボックスが利用可能です ");} jquery( "#email")。val(); var flag = false; jquery.ajax({url: "checkemail?t =" +(new date())。 true;}}}不正! ";} else {flag = true;} if(!flag){jquery("#randcodediv ")。RemoveClass()。addclass(" ui-form-item has-error "); jquery("#randcodep ")。html(" "); jquery("#randcodep ") ui-margin-right10/"> <// i>"+message); // jquery( "#randcode")。focus();} else {jquery( "#randcodediv")。removeclass() has-success "); jquery("#randcodep ")。html(" "); jquery("#randcodep ")。html(" <i class =/"icon-sucess ui-margin-right10/" econ-sucess ui-margin-right10/"> <// i>");} return flag;} jQuery( "#randcode")。val(); var flag = false; jquery.ajax({url: "checkrandcode?t =" +(new date())。 "1"){flag = true;}}}}); return flag;} // function vailagree(){if(jquery( "#aseile")。is( ":checked")){return true;} elser( "allert(" xxプロトコルに読んで同意するかどうかを確認してください "); str = str.replace(/<//?[^>]*>/gim、 ""); //すべてのhtmlタグvar result = str.replace(/(^/s+)|(/s+$)/g、 "); html> <html> <body> <h1> JavaScriptの最初の段落</h1> <p>番号を入力してください。入力値が数字でない場合、ブラウザはプロンプトボックスをポップアップします。 </p> <input id = "demo" type = "text"> <script> function myfunction(){var x = document.getElementById( "demo")。value; if(x == ""){alert( "input nable ve each"); return;} if(isnan(x)){alert( "番号を入力してください"); return;} if(x.length!= 6){alert( "6桁を入力してください"); return;}} </script> <button type = "button" onclick = "myfunction()">ここをクリック</button> </body> </html> //パスワードが数値文字checkpwd(pwd){var validstr = = "abcdefghijklmnopqrstuvwxyzabcdefghijklmnopqrstuvwxyz0123456789_〜/!@@#$%^ &:;-+.=、"; -1){return false;}} return true;} //メールボックス形式の関数checkemail(email){var filter = /^( [a-za-z0-9_/./-])+/@(( [za-z0-9/] false;} return true;} function isemail(val){return /^((((( [now-dmitomer]] /?/^_ `{/|}〜] | [/u00a0-/ud7ff/uf900-/ufdcf/ufdf0-/uffef])+)*)|((/x22)(((/x20 |/x09)*(/x0d/x0a)?(/x20 |/x09)+) - /x08/x0b/x0c/x0e-/x1f/x7f] |/x21 | [/x23-/x5b] | [/x5d-/x7e] | [/u00a0-/ud7ff/uf900-/ufdcf/ufdf0-/uffef]) b/x0c/x0d-/x7f] | [/u00a0-/ud7ff/uf900-/ufdcf/uffdf0-/uffef]))))))*(/x0d/x0a))?(/x20 |/x09)+? az] |/d | [/u00a0-/ud7ff/uf900-/ufdcf/ufdf0-/uffef])|(([az] |/d | [/u00a0-/ud7 ff/uf900-/ufdcf/ufdf0-/uffef])) dcf/ufdf0-/uffef])) /。([az ]|...u000a0-/ud7ff/uf900-/ufdcf/ufdf0-/uffef●)/.)+([az ]|.../u00 a0-/ud7ff/uf900-/ufdcf/ufdf0-/uffef]))))))))))) - /ud7ff/uf900-/ufdcf/ufdf0-/uffef])))))電話番号検証関数checktelephone(携帯電話){var regcellphone =/^([0-9] {11})?$/; falg = cellphone.search(regcellphone); if(falg == -1); if(falg == -1){return false;} els {return true;}} // param.length = query.indexof(param); if(istart == -1)return ""; isTart + = ilen + 1; var iend = query.indexof( "&"、istart); if(iend == -1)return query.substring(istart);上記のコードは、編集者によって紹介されたJSフォーム検証です。コードはシンプルで理解しやすく、非常に実用的です。私はそれが誰にでも役立つことを願っています。同時に、Wulin NetworkのWebサイトへのご支援に感謝します!