在一些网站的会员注册页面里,为提高用户的责任心,以及给用户留下足够的时间阅读注册协议,可以采用10s倒计时以后才可以单击“注册”按钮的特效,代码相对较少。
案例展示
代码实现
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>阅读协议</p>
<input type="button" value="注册(10)" id="btn" disabled>
</body>
<script>
var sec = 10;
(function(){
timer = setInterval(function(){
var btn = document.getElementById('btn');
sec--;
btn.value = '注册('+sec+')';
if(sec == 0){
clearInterval(timer);
btn.disabled = false;
btn.value = '注册';
}
}, 1000)
}) ();
</script>
</html>