jQuery实现倒计时效果
以下是一个使用jQuery实现倒计时效果的简单示例代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>倒计时效果</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<div id="timer">00:00:10</div>
<script>
$(document).ready(function(){
var countdownDuration = 10; // 倒计时时间（秒）
var display = $('#timer');
var timer = setInterval(function() {
var minutes = parseInt(countdownDuration / 60, 10);
var seconds = parseInt(countdownDuration % 60, 10);
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
display.text(minutes + ":" + seconds);
if (--countdownDuration < 0) {
clearInterval(timer);
display.text("时间到!");
}
}, 1000);
});
</script>
</body>
</html>这段代码会在页面上显示一个倒计时，从10秒开始，每秒更新一次显示时间，直至时间结束。倒计时时间可以通过修改 countdownDuration 变量的值来自定义。
评论已关闭