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');
Ringkasan pengetahuan asas java
Penyelesaian kepada ralat soket 10054
Apakah platform Fengxiangjia?
Perbezaan antara versi rumah win10 dan versi profesional
Pengenalan kepada penggunaan rowid dalam oracle
Bagaimana untuk menggunakan python untuk gelung
Apakah unsur li?
Bagaimana untuk membuat projek HTML dengan vscode
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
