Fonction de compte à rebours pour envoyer le code de vérification lors de l'inscription via téléphone mobile

Dans de nombreux cas, peu importe ce que vous enregistrez, il y aura un code de vérification, ainsi qu'une fonction de compte à rebours. L'éditeur de cet article partagera avec vous un exemple simple de la façon d'envoyer un compte à rebours de code de vérification pour mobile. inscription par téléphone. Il a une très bonne valeur de référence. Suivons l'éditeur pour y jeter un œil. J'espère que cela pourra aider les autres.

est la suivante :

()这里用的是input做的点击发送验证码
<input type="number" class="input" name="mobile" placeholder="手机号" style="border: none"

<input class="hui_kuang"style="width: 30%;text-align: center;height: 42px"onclick="setTime(this)" value=&#39;获取验证码&#39;>
<script>
　　
//页面初始化获取倒计时数字（避免在倒计时时用户刷新浏览器导致倒计时归零）
 var $getCodeInput = $(".hui_kuang");
 var sessionCountdown = sessionStorage.getItem("countdown");
 if (!sessionCountdown) {
  $(".hui_kuang").val("获取验证码")
 } else {
  $(".hui_kuang").val("重新发送(" + sessionCountdown + ")");
  setCode($getCodeInput, sessionCountdown);
 }
 //获取验证码
 function setTime() {
  var remobile = $("#registForm input[name=&#39;mobile&#39;]").val();
  if (!remobile) {
   alert("请输入手机号码")
   return;

  }
  if (!(/^1[3|4|5|8][0-9]\d{4,8}$/.test(remobile))) {
   alert("请输入有效的手机号码")
   return;
  } else {
   setCode($getCodeInput, 60);
  }

 }
 //发送验证码倒计时
 function setCode($getCodeInput, countdown) {
  if (countdown == 0) {
   $getCodeInput.attr(&#39;disabled&#39;, false);
//   $getCodeInput.removeAttribute("disabled");
   $getCodeInput.val("获取验证码");
   sessionStorage.removeItem("countdown");
   return;
  } else {
   $getCodeInput.attr(&#39;disabled&#39;, true);
   $getCodeInput.val("重新发送(" + countdown + ")");
   countdown--;
  }
  sessionStorage.setItem("countdown", countdown);
  window.setTimeout(function () {
   setCode($getCodeInput, countdown);
  }, 1000);
 }
</script>

L'avez-vous appris ? Les idées sont les mêmes et j'espère que cela pourra aider tout le monde.

Recommandations associées :

Comment utiliser php pour envoyer des codes de vérification par SMS

Exemple d'implémentation de la fonction de connexion du code de vérification Thinkphp

Méthode JS pour implémenter le code de vérification

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!