zoukankan      html  css  js  c++  java
  • js 倒计时 跳转

    1. setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。

    setTimeout() 只执行 code 一次。如果要多次调用,请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
        <html xmlns="http://www.w3.org/1999/xhtml">  
        <head runat="server">  
            <title>setTimeout</title>  
        </head>  
        <body>  
                <div id='div1'>  </div>  
              
        </body>  
        </html>  
          
        <script type="text/javascript">  
        //设定倒数秒数  
        var t = 10;  
        //显示倒数秒数  
        function showTime(){  
            t -= 1;  
            document.getElementById('div1').innerHTML= t;  
            if(t==0){  
                location.href='http://www.baidu.com';  
            }  
            //每秒执行一次,showTime()  
            setTimeout("showTime()",1000);  
        }  
          
          
        //执行showTime()  
        showTime();  
        </script>  

    2.

    setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。

    setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

    <html>
    <body>
    
    <input type="text" id="clock" size="35" />
    <script language=javascript>
    var int=self.setInterval("clock()",50)
    function clock()
      {
      var t=new Date()
      document.getElementById("clock").value=t
      }
    </script>
    </form>
    <button onclick="int=window.clearInterval(int)">
    Stop interval</button>
    
    </body>
    </html>

    example :

        <html> 
        <head> 
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
        <title>js定时跳转页面的方法</title> 
        </head> 
        <body> 
        <script type="text/javascript"> 
        var t=10;//设定跳转的时间 
        setInterval("refer()",1000); //启动1秒定时 
        function refer(){  
            if(t==0){ 
                location="www.baidu.com"; //#设定跳转的链接地址 
            } 
            document.getElementById('show').innerHTML=""+t+"秒后跳转"; // 显示倒计时 
            t--; // 计数器递减 
        } 
        </script> 
        <span id="show"></span> 
        </body> 
        </html> 

    遇到的问题:

     当将上述js 的方法 放在$(function(){......})中时, 浏览器会报 methodXX() is not defined;

    应当将function(){}的定义放在 <script></script>中

  • 相关阅读:
    博客迁移至wordpress--http://i1994898w1.imwork.net/wordpress
    超外差接收机的中频选择
    The Basics of the Doherty Amplifier-Bill Slade [转载]
    闻灾情 忆国殇 山河呜咽 寄哀思
    Simplest Doppler Radar System
    开发人员的奋斗目标
    敏捷开发的推理
    在创业型软件公司的收获
    人才市场的IT职位分析
    MySQL 基础及性能优化工具
  • 原文地址:https://www.cnblogs.com/rocky-fang/p/5622775.html
Copyright © 2011-2022 走看看