网页当进行提交之后我们会来到一个提示成功失败，也可能是另一个网页来进行这些的提示并且自动返回。
跳转.gif
我们首先来看一下main.html,很简单就是一个超链接
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>主页</title>
</head>
<body>
<span>我就是我，颜色不一样的烟火</span>
<a href="delay.html">跳转</a>
</body>
</html>
再来看跳转等待的页面：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>等待跳转</title>
<script type="text/javascript" src="http://apps.bdimg.com/libs/javascript-state-machine/2.0.0/state-machine.min.js"></script>
</head>
<body>
<span id="time">4</span>秒钟后自动跳转，如果不跳，请点击下面链接
<script language="JavaScript1.2" type="text/javascript">
function delayURL(url) {
var delay = document.getElementById('time').innerHTML;
if(delay > 1){
delay--;
document.getElementById('time').innerHTML = delay;
}else{
window.top.location.href = url;
}
setTimeout("delayURL('"+url+"')",1000);
}
</script>
<a href="main.html">链接点击</a>
<script type="text/javascript">
delayURL("main.html");
</script>
</body>
</html>
这样我们就完成了。
验证码等待时间：
code.gif
代码：
<script type="text/javascript">
var time = 5;
function getCode() {
alert("发送成功");
setTime();
}
function setTime() {
console.log(time);
var btn = document.getElementById("code");
btn.setAttribute("disabled", true);
if(time>0){
btn.value = "发送成功 ( "+time+" )";
time--;
setTimeout(function () {
setTime();
},1000);
}else{
btn.value = "点击获取验证码";
btn.removeAttribute("disabled");
time = 5;
}
}
</script>
网友评论