zoukankan      html  css  js  c++  java
  • H5页面添加倒计时,然后自动跳转

    下面给出一个倒计时页面的代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>修改密码</title>
    </head>
    <body>
    <div style=" 400px; margin-left: auto; margin-right: auto; display: flex; flex-direction: row; text-align: center;margin-top: 200px;">
    <div style="display: flex; flex-direction: column;">
    <font style="margin-top: 10px">恭喜您!修改密码成功</font>
    <font><font color="#166f97" id="f1">5s</font>后将跳转至登录页</font>
    <a href="https://123.sogou.com/" style="text-decoration: none;margin-top: 5px;color: #166f97">【手动跳转】</a>

    //这个链接写自己想要跳转到链接
    </div>
    </div>
    </body>
    <script type="text/javascript">

    var i = 5;//定义倒计时的总时间为5s
    var xx = window.setInterval(tt, 1000);
    function tt(){
      i--;
      document.getElementById('f1').innerHTML = i + 's';
      if(i == 0){
      window.clearInterval(xx);
      window.location.href = "https://123.sogou.com/";

      //这个链接写自己想要跳转到链接

      }
    }
    </script>
    </html>

    注意:当修改完密码成功,会出现一个倒计时为5s的提示,

     当时间为0是会自动跳转到一个新的地址。而上面设置的地址是搜狐浏览器的

    网页大全。

  • 相关阅读:
    MySQL经典练习题(四)
    MySQL经典练习题(三)
    MySQL经典练习题(二)
    MySQL经典练习题(一)
    MySQL经典练习题-数据准备
    表连接
    子查询
    MySQL中函数分类
    排序
    数据分组
  • 原文地址:https://www.cnblogs.com/wyf-love-dch/p/7131743.html
Copyright © 2011-2022 走看看