Nonsense not much to say directly on the code
HTML code:
<form method= "POST" id= "Form_hroizon" enctype= "Multipart/form-data" action= "/" > <input type= "hidden" name= " Phonetemplet "id=" Phonetemplet "> <input type=" hidden "name=" Regtype "id=" Regtype "> <div class=" C-login-input "> <div class=" Form-group "> <label for=" inputEmail3 "class=" Label-control label-width120 Pull-left t-r-f F16 "> Mobile number </label> <div class=" Pull-left "> <input type=" Tel "autocomplete=" Off "class= "Input-control put-width440 j-telphone id=" Inputtel "name=" Phones "placeholder=" Please enter your phone number "value=" > <span Class= "F12 Red tel-msg" ></span> <div class= "c-login-errtips" style= "Display:none"; ></div> </div> </div> <div class= "Form-group" > <label for= "inputEmail3" class= " Label-control label-width120 pull-left t-r-f f16 "> Login password </label> <div class=" Pull-left "> <input type=" Password "class=" Input-control put-width440 fistpwd "id=" inputpwd "name=" password "placeholder=" "Please enter password" value="" > <span class= "F12 Red pwd-msg" ></span> </div> </div> <div class= "Form-group" > < Label for= "InputEmail3" class= "Label-control label-width120 pull-left t-r-f F16" > Authentication code </label> <div class= " Pull-left "> <input type=" tel "class=" Input-control put-with100 vericode "id=" inputEmail3 "name=" code " Placeholder= "Please enter the verification code" > <input id= "btnsendcode" type= "button" value= "free access to the verification code" class= "J-getcode F12, B-i-k Code-btn c-p "/> <span class=" F12 Red code-msg "></span> </div> </div> </div> <div CLA ss= "Form-group" > <a class= "j-sends" type= "Submit" name= "Submit" target= "_self" href= "javascript:void (0)" > Registration </a> </div> </form>
JS code:
<script type= "Text/javascript" > $ (Function () {$ (". J-sends"). Click (function () {var phones = $.trim ($ ().
J-telphone "). Val ()); var ismobile=/^ ((13[0-9]{1}) | ( 15[0-9]{1}) | (18[0-9]{1}))
+\D{8}) $/; if (!phones) {$ ('. Tel-msg '). Text (' Please enter your mobile number, cannot be empty '); else if (!ismobile.test (phones)) {$ ('. Tel-msg '). Text (' Please enter a valid cell phone number '); else{//Phone number exists $.ajax ({URL: "/",//Type: "Post", DataType: "JSON", data:{Phones:phones,}, ContentType: ' application/ Json;charset=utf-8 ',//async:false, success:function (data) {if (Data.flag = = "1") {//$ ('. Tel-msg '). HTML (data.errorinf O);
return false;
}else{$ ('. Tel-msg '). HTML (data.errorinfo);//Can}, Error:function () {}}); })//Verification code countdown VAR Intervalobj; Timer variable, control time var count = 30; Interval function, 1 seconds to execute var curcount;//the current remaining number of seconds var code = "";
Verification code var Regtype;
var Phonetemplet;
var codelength = 4;//Authenticode length $ (". Code-btn"). Click (function () {curcount = count; var Phone=$.trim ($ (". J-telphone"). Val ())//mobile number Var ismobile=/^ (((13[0-9]{1) | 15[0-9]{1}) | (18[0-9]{1}))
+\D{8}) $/;
var Jtel = $ (". J-telphone"); if (Phone!= "" && ismobile.test (phone) && phone.length==11) {//Set button effect, start timing $ ("#btnSendCode"). attr (
"Disabled", "true");
$ ("#btnSendCode"). Val ("Please enter the verification code in" + Curcount + seconds); Intervalobj = Window.setinterval (setremaintime, 1000);
Start timer, 1 seconds to execute//Generate Authenticode for (var i = 0; i < codelength i++) {code + parseint (Math.random () * 9). toString (); ///To the background authenticated code $.ajax ({url:base + "/", type: "POST",//DataType: "Text",//Data: "phones=" + Phone + "&code=" + Code, DataType: "JSON", data:{Phones:phone, Code:code, Regtype: "1", Phonetemplet: "Phone_uc"}, Success:function (data
{if (data.flag== "F") {$ (". Code-msg"). HTML (data.errorinfo);
}else{$ (". Code-msg"). HTML (data.errorinfo);}}
});
}else{$ ('. Tel-msg '). Text (' Please enter a valid mobile number ');
}
}); Timer handler function Setremaintime () {if (Curcount = 0) {window.clearinterval (intervalobj);/Stop Timer $ ("#btnSendCode" ). Removeattr ("Disabled");/Enable button $ ("#bTnsendcode "). Val (" Resend Verification Code "); Code = ""; Clears the verification code.
If you do not clear, after the time, enter the received verification code is still valid} else {curcount--;
$ ("#btnSendCode"). Val ("Please enter the verification code in" + Curcount + seconds); }}) </script>
The above is a small set of JS to introduce the realization of form verification function (verify the existence of mobile phone number, verification code countdown), I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!