源码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="js/jquery-3.4.1.js"></script>
<label for="show">倒计时:</label>
<input type="number" id="show" style="width: 45px;" />s
<button onclick="start()">开始倒计时</button>
<script>
var times = 0;
var clear_cutTime;
function start() {
times = $('#show').val();
//锁定输入框
$("#show").attr("disabled", "true");
clear_cutTime = setInterval("cutTime()", 1000);
}
function cutTime() {
times--; //js支持一元运算符
$('#show').val(times);
if (times <= 0) {
clearInterval(clear_cutTime);
new Audio("res/qnxt.mp3").play();
}
}
</script>
</body>
</html>
希望能对大家有所帮助。