Javascript가 SMS 확인 코드 구현 code_javascript 기술을 보냅니다.
- WBOY원래의
- 2016-05-16 15:32:461904검색
이 글에서는 먼저 휴대폰으로 인증코드를 보내는 원리를 분석한 후, SMS 인증코드를 보내기 위해 자바스크립트를 구현합니다.
"인증 코드 전송" 버튼을 클릭하면 버튼에 "59초 후 재시도", "58초 후 재시도"가 표시됩니다... 카운트다운이 0초에 도달할 때까지 그런 다음 "인증 코드 전송"으로 돌아갑니다. 카운트다운 중에는 버튼이 비활성화됩니다.
첫 번째 단계, 버튼 가져오기, 이벤트 바인딩, 타이머 변수 및 타이밍 변수 설정
두 번째 단계는 타이머를 추가하는 것입니다. 타이머가 0보다 작거나 같을 때 타이머가 지워질 때까지 타이머는 1초마다 1씩 감소하며, 버튼은 "인증 코드 보내기"로 돌아갑니다. 그렇지 않으면 "X초 후에 다시 시도"로 표시됩니다.
렌더링:
구현 코드:
<!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>
참고:
버튼 비활성화 여부를 설정할 때 send.disabled=true;
참과 거짓은 인용할 수 없습니다! 참과 거짓은 인용할 수 없습니다! 그렇지 않으면 값은 항상 참이 됩니다.
send.setAttribute('disabled','disabled');
를 사용할 수도 있습니다.
또는 send.removeAttribute('disabled');
위 내용은 모두 공유해드린 자바스크립트로 SMS 인증코드를 보내는 코드입니다. 공부에 도움이 되셨으면 좋겠습니다.
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.