Home > front end >  Send verification code countdown 60 s
Send verification code countdown 60 s

Time:12-08


 


<meta charset="UTF-8">
<meta name="viewport" content="width=device - width, initial - scale=1.0" & gt;
Send verification code countdown & lt;/title> <br/><style> <br/>* {<br/>margin: 0; <br/>padding: 0; <br/>} <br/>Div {<br/>Width: 500 px; <br/>Height: 500 px; <br/>Margin: 100 px auto; <br/>border: 1px solid #eee; <br/>text-align: center; <br/>} <br/>Input {<br/>Height: 38 px; <br/>The line - height: 38 px; <br/>} <br/>. SendPhoneCodeWait {<br/>Margin - top: 100 px; <br/>display: inline-block; <br/>width: 150px; <br/>height: 40px; <br/>The line - height: 40 px; <br/>text-align: center; <br/>Background - color: RGB (30, 102, 209); <br/>Color: # FFF. <br/>border: none; <br/>} <br/></style> <br/></head> <br/><body> <br/><Div> <br/><Input type="text" id="phone" placeholder="phone number" & gt; <br/><Input id="sendcode" type="button" value="https://bbs.csdn.net/topics/for phone verification code" & gt; <br/></div> <br/></body> <br/><script SRC="https://bbs.csdn.net/topics/jquery.min.js" & gt; </script> <br/><script> <br/>$(function () {<br/>//click on send verification code <br/>$(" # sendcode "). Click (function () {<br/>Var sendcode1=$(" # phone "). Val (); <br/>The console. The log (sendcode1) <br/>Var Strcellphonedata=https://bbs.csdn.net/topics/{" phone ": sendcode1} <br/>If ((/^ [1] [3,4,5,7,8] [0-9] {9} $/. The test (sendcode1))) {<br/>Sendcode invokeSettime (" "); <br/>//ajax <br/><br/>Return <br/>} the if (! ,4,5,7,8 (/^ [1] [3] [0-9] {9} $/. The test (sendcode1))) {<br/>Alert (" cell phone number is wrong "); <br/>} <br/>}); <br/><br/>//sending mobile phone verification code <br/>The function invokeSettime (obj) {<br/>Var _obj=$(" # "+ obj); <br/>Var countdown=60; <br/>Settime (obj); <br/>The function settime (obj) {<br/>If (countdown==0) {<br/>_obj. Attr (" disabled ", false); <br/><br/>_obj. Val (" get verification code "); <br/>countdown=60; <br/>//$(" # "+ obj). CSS ({" background - color" : "green", "border" : "1 px solid green"}); <br/>_obj. RemoveClass (" sendPhoneCodeWait "). The addClass (" sendPhoneCode "); <br/>return; <br/>} else {<br/>_obj. RemoveClass (" sendPhoneCode "). The addClass (" sendPhoneCodeWait "); <br/>_obj. Attr (" disabled ", true); <br/>_obj. Val (" (" + countdown +) "s resend after"); <br/>Countdown -; <br/>$(". SendPhoneCodeWait "). The CSS (" background ", "# e8e8e8"); <br/><br/>} <br/>If (countdown==0) {<br/>$(". SendPhoneCodeWait "). The CSS (" background ", "# 2 d8bff"); <br/><br/>} else {<br/>} <br/>SetTimeout (function () {<br/>Settime (obj)} <br/>, 1000) <br/>} <br/>} <br/>}); <br/></script> <br/></html> <br/></pre> <br/><img SRC="https://img.codepudding.com/202012/175531080233283.jpg" Alt=""/><p class="article - content rp"> CodePudding user response: </p>So this is a popular science is not a problem is you<p class="article - content rp"> CodePudding user response: </p>Just don't know much about hair wrong into the pit<p class="article - content rp"> CodePudding user response: </p>To determine whether a mobile phone number correctly if the else not regular line also twice<p class="article - content rp"> CodePudding user response: </p><img SRC="https://img.codepudding.com/202012/175531080233284.gif" Alt=""/> </div> <div class="th_page th_page_color"></div> <div class="umCopyright"> <p>Page link:<a href="/frontend/93029.html" target="_blank" style="color:#999">https//www.codepudding.com/frontend/93029.html</a></p> </div> <div class="detail-arr"> <div class="detail-arr-left">Prev:<a href='/frontend/93028.html'>Report for shielding QQ WeChat built-in browser button code</a></div> <div class="detail-arr-right">Next:<a href='/frontend/93030.html'>Dedecms slides in the picture how to control the size, please?</a></div> </div> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="hot-tags neitags"> <ul> <li><i class="iconfont icon-x-tags"></i> Tags:  </li> <a href='/e/tags/?tagname=JavaScript' target='_blank'>JavaScript</a> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="xiangguan"> <ul class="msg msghead"> <li class="tbname">Related</li> </ul> <ul> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="flinks"> <ul> <li><i class="iconfont icon-x-tags"></i> Links:  </li> <li class="liflinks"><a target="_blank" href="/" title="CodePudding">CodePudding</a></li> </ul> </div> </div> </div> </div> <div class="footer"> <p><span style="font-size:16px;color:#666;font-weight: bold">About Us:</span>  <a href="https://www.codepudding.com/contact.html">Contact Us</a>      <a href="https://www.codepudding.com/service.html">Terms of Service</a>      <a href="https://www.codepudding.com/privacy.html"> Privacy Policy</a></p> <p class="foot_info">Copyright © 2010-2023,Powered By <a href="/" target="_blank">CodePudding</a> </p> </div> <script type="text/javascript" src="/skin/code/tianhu.js"></script> </body></html>