이 글은 주로 jquery를 사용하여 60초 카운트다운을 구현하는 방법을 소개합니다. 이제 이를 공유합니다. 도움이 필요한 친구들이 참고할 수 있습니다.
보내기 버튼 카운트다운은 프런트엔드에서 자주 사용됩니다. 매번 다시 작성하는 일이 꽤 귀찮습니다. 나중에는 직접 코드를 복사해 보세요
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" id="viewport" name="viewport">
<title>60s倒计时</title>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<input type="button" value="邮箱验证码" onclick="sendVerificationCode(this)" />
<script type="text/javascript">
//发送验证码按钮的60s倒计时
var countdown = 60;
function sendVerificationCode(obj) {
if(countdown == 0) {
obj.removeAttribute("disabled");
obj.value = "重新获取";
countdown = 60;
return;
} else {
obj.setAttribute("disabled", true);
obj.value = "重新(" + countdown + ")";
countdown--;
}
setTimeout(function() {
sendVerificationCode(obj)
}, 1000)
}
</script>
</body>
</html> 위 내용은 모두의 학습에 도움이 되기를 바랍니다. PHP 중국어 웹사이트를 주목해주세요!
관련 권장 사항:
IE 67과의 호환성을 달성하기 위한 querySeletor의 진정한 모방
위 내용은 jquery를 사용하여 60초 카운트다운을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
