Rumah > Artikel > hujung hadapan web > Javascript menghantar kod pengesahan SMS kemahiran pelaksanaan kod_javascript

Javascript menghantar kod pengesahan SMS kemahiran pelaksanaan kod_javascript

WBOYasal: 2016-05-16 15:32:461876semak imbas

Artikel ini mula-mula menganalisis prinsip penghantaran kod pengesahan melalui telefon mudah alih, dan kemudian melaksanakan javascript untuk menghantar kod pengesahan SMS Idea khusus adalah seperti berikut:
Selepas mengklik butang "Hantar Kod Pengesahan", butang akan memaparkan "Cuba Semula dalam 59 saat", "Cuba Semula dalam 58 saat"... sehingga kiraan detik mencapai 0 saat dan kemudian kembali ke "Hantar Kod Pengesahan". Butang dilumpuhkan semasa kira detik.

Langkah pertama, dapatkan butang, ikat acara, tetapkan pembolehubah pemasa dan pembolehubah masa

Langkah kedua ialah menambah pemasa , dan pemasa akan berkurangan sebanyak 1 setiap 1 saat sehingga pemasa dikosongkan apabila pemasa kurang daripada atau sama dengan 0, dan butang akan kembali ke "Hantar Kod Pengesahan" ”, jika tidak, ia akan dipaparkan sebagai “Cuba semula dalam X saat”

Rendering:

Kod pelaksanaan:

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script type="text/javascript">
  window.onload=function(){
    var send=document.getElementById('send'),
      times=60,
      timer=null;
    send.onclick=function(){
     // 计时开始
     var that = this;
      this.disabled=true;
      timer = setInterval(function(){
        times --;
        that.value = times + "秒后重试";
        if(times <= 0){
          that.disabled =false;
          that.value = "发送验证码";
          clearInterval(timer);
          times = 60;
        }
        //console.log(times);
      },1000);  
    }  
  } 
  </script>
</head>
<body>
  <input type="button" id="send" value="发送验证码">
</body>
</html>

Nota:

Apabila menetapkan sama ada butang dilumpuhkan, send.disabled=true;
Betul dan salah tidak boleh disebut Betul dan salah tidak boleh dipetik! Anda juga boleh menggunakan
send.setAttribute('disabled','disabled');
atau send.removeAttribute('disabled');

Di atas adalah semua kod untuk menghantar kod pengesahan SMS melalui javascript yang dikongsi dengan anda.

Kenyataan：

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel sebelumnya：Penjelasan terperinci tentang penggunaan kaedah ready() jquery event_jqueryArtikel seterusnya：Penjelasan terperinci tentang penggunaan kaedah ready() jquery event_jquery

Artikel berkaitan

Lihat lagi