一、js倒计时
function countDown(time) {
var nowTime = +new Date();
var oddTime = +new Date(time);
var times = (nowTime - oddTime) / 1000;
var d = parseInt(times / 60 / 60 / 24);
var h = parseInt(times / 60 / 60 % 24);
var m = parseInt(times / 60 % 60);
var s = parseInt(times % 60);
d = d < 10 ? '0' + d : d;
h = h < 10 ? '0' + h : h;
m = m < 10 ? '0' + m : m;
s = s < 10 ? '0' + s : s;
return d + '天 ' + h + '时 ' + m + '分 ' + s + '秒';
}
console.log(countDown(new Date('2022-02-10 19:00:00')));
简易版
<!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>
<style>
div {
display: flex;
justify-content: space-around;
width: 200px;
height: 250px;
padding-top: 150px;
box-sizing: border-box;
background-color: pink;
}
span {
width: 40px;
height: 40px;
line-height: 50px;
font-size: 24px;
text-align: center;
background-color: gainsboro;
}
</style>
</head>
<body>
<div>
<span class="d"></span>
<span class="h"></span>
<span class="m"></span>
<span class="s"></span>
</div>
<script>
var day_txt = document.querySelector('.d');
var hour_txt = document.querySelector('.h');
var minute_txt = document.querySelector('.m');
var second_txt = document.querySelector('.s');
var time = new Date('2022-02-21 08:00:00');
countDown(time);
setInterval(function() {
countDown(time);
},1000)
function countDown(time) {
var oddTime = +new Date();
var nowTime = +new Date(time);
var times = (nowTime - oddTime) / 1000;
var d = parseInt(times / 60 / 60 / 24);
var h = parseInt(times / 60 / 60 % 24);
var m = parseInt(times / 60 % 60);
var s = parseInt(times % 60);
d = d < 10 ? '0' + d : d;
h = h < 10 ? '0' + h : h;
m = m < 10 ? '0' + m : m;
s = s < 10 ? '0' + s : s;
day_txt.innerHTML = d;
hour_txt.innerHTML = h;
minute_txt.innerHTML = m;
second_txt.innerHTML = s;
}
</script>
</body>
</html>
二、发送短信
<body>
手机号
<input type="text">
<button>发送</button>
</body>
<script>
var btn = document.querySelector('button');
var timeCount = 5;
var timer = null;
btn.addEventListener('click', function() {
btn.disabled = true;
timer = setInterval(function() {
if(timeCount == 0) {
clearInterval(timer);
btn.disabled = false;
btn.innerHTML = '发送';
timeCount = 5;
}else {
btn.innerHTML = timeCount + '秒后可点击再次发送短信';
timeCount--;
}
}, 1000)
})
</script>