`
rayln
  • 浏览: 433939 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

setInterval&&clearInterval

 
阅读更多
转载:http://blog.csdn.net/zyming0815/article/details/4710953

一、setInterval

用法
setInterval(functionName, interval [, param1, param2, ..., paramN])

参数
functionName 一个函数名或者一个对匿名函数的引用。

interval 对 functionName 参数的两次调用之间的时间(以毫秒为单位)。

param1, param2, ..., paramN 传递到 function 或 methodName 参数的可选参数。

示例
用法 1:下面的示例每隔 1000 毫秒(每隔 1 秒)调用一次匿名函数。

setInterval( function(){ trace("interval called"); }, 1000 );


用法 2:下面的示例定义两个事件处理函数并分别调用它们。对 setInterval() 的两次调用的结果都是每隔 1000 毫秒就向“输出”面板发送字符串 "interval called"。对 setInterval() 的第一个调用将调用 callback1() 函数,该函数包含 trace() 动作。对 setInterval() 的第二个调用将 "interval called" 字符串作为参数传递给函数 callback2()。

function callback1() {
  trace("interval called"); 
}

function callback2(arg) { 
  trace(arg);
}

setInterval( callback1, 1000 ); 
setInterval( callback2, 1000, "interval called" );

用法 3:此示例使用对象的方法。当要调用为对象定义的方法时,必须使用此语法。

obj = new Object();
obj.interval = function() { 
  trace("interval function called"); 
}

setInterval( obj, "interval", 1000 );

obj2 = new Object();
obj2.interval = function(s) { 
  trace(s); 
}
setInterval( obj2, "interval", 1000, "interval function called" );

必须使用第二种格式的 setInterval() 语法来调用对象的方法,如下所示:

setInterval( obj2, "interval", 1000, "interval function called" );

二、clearInterval

定义和用法
clearInterval() 方法可取消由 setInterval() 设置的 timeout。
clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。

语法
clearInterval(id_of_setinterval)
参数
id_of_setinterval 由 setInterval() 返回的 ID 值。
实例
下面这个例子将每隔 50 毫秒调用 clock() 函数。您也可以使用一个按钮来停止这个 clock:

<html>
<body>

 <form>

     <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>

==================倒计时===================

function TimeStart(length)
{
    length = length * 60;
    if(timer)
    {
        TimeStop();
    }
    timelen = length;
    timenow = length;
    timer = setInterval(checktime,1000);
    SetMsg('进行中...');
}

function TimeStop()
{
    clearInterval(timer);
}

function checktime()
{
    if(timenow >0 )
    {
        var txt = '';
        if(timenow < 300)
        {
            if(color == 0){txt += '<font color="red">' + GetTimeText(timenow) + '</font>';color=1;}
            else{txt += '<font color="black">' + GetTimeText(timenow) + '</font>';color=0;}
        }
        else
        {
            txt += GetTimeText(timenow);
        }
        txt += "&nbsp;/&nbsp;" + GetTimeText(timelen);
        document.getElementByID("time").innerHTML = txt;
        timenow--;
    }
    else
    {
        window.frames["url_mainframe"].document.getElementById("Button1").click();
        clearInterval(timer);
    }
}

function GetTimeText(len){
    var text = checklen(parseInt(len / 3600).toString());
    text += ":";
    text += checklen(parseInt(len % 3600 / 60).toString());
    text += ":";
    text += checklen(parseInt(len % 60).toString());
    return text;
}
function checklen(text)
{
    if(text.length < 2){text = '0' + text;}
    return text;
}
分享到:
评论

相关推荐

    window.clearInterval与window.setInterval的用法.

    ### window.clearInterval与window.setInterval的用法 在前端开发中,经常需要用到定时器来实现某些功能,例如计时器、轮播图等。而`window.setInterval`和`window.clearInterval`是JavaScript中用于处理定时任务的...

    setinterval()与clearInterval()JS函数的调用方法

    本文实例讲述了setinterval()与clearInterval()JS函数的调用方法。分享给大家供大家参考。具体如下: 代码如下:&lt;!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” ...

    setInterval与clearInterval的使用示例代码

    setInterval是一个很有用的js函数,可以用来重复执行某些功能,利用这个我们可以实现一些很有趣的功能,比如: 不刷新页面的情况下,”实时”获取其它会员给你发来的问候,并弹出显示之类 下面给一个示例代码:(里面用...

    setInterval 引起的性能问题

    如果一个`setInterval`的任务没有被清除(通过`clearInterval`),那么即使相关组件已被卸载,这个定时器仍然会继续执行,占用内存资源。这在处理动态生成的元素或用户交互时尤其需要注意。 另外,`setInterval`的...

    setInterval

    在JavaScript中,`setInterval`是一个非常重要的全局函数,它用于执行指定的函数或表达式,每隔一定的时间间隔。这个时间间隔通常以毫秒为单位。`setInterval`是JavaScript定时器API的一部分,用于实现定时任务,...

    关于setInterval定时器的使用示例

    在JavaScript中,`setInterval`是一个非常常用的函数,用于定期执行某个函数或代码块。它在Web开发中扮演着重要角色,特别是在创建动画效果、定时更新内容或者执行后台任务时。下面我们将深入探讨`setInterval`的...

    setInterval使用 每隔一定时间执行操作

    在实际使用中,`setInterval` 会立即返回一个表示定时器的唯一标识符,这个标识符可以用于通过 `clearInterval` 函数来取消定时器。例如: ```javascript var timerId = setInterval(function() { console.log('...

    动态时钟,利用setInterval

    当你调用`setInterval`时,它会立即返回一个唯一的`interval ID`,这个ID可以用于通过`clearInterval`函数取消定时器。 让我们来看一个简单的动态时钟实现的例子: ```javascript function updateClock() { var ...

    Javascript中, setTimeout() 和 setInterval() 的方法

    例如,对于`setTimeout()`,可以使用`clearTimeout()`,而对于`setInterval()`,则使用`clearInterval()`。 在实际开发中,`setTimeout()`常用于实现一次性延迟执行,如加载动画的结束;而`setInterval()`则适用于...

    Js动画效果-setInterval(function,time)的主要应用

    使用`clearInterval()`函数可以停止由`setInterval()`启动的定时器。这在需要结束动画或计时器时非常有用,避免资源浪费。 现在,我们通过一个简单的`setInterval()`动画示例来理解其工作方式: ```javascript ...

    Javascript定时器(二)——setTimeout与setInterval

    此外,如果定时器触发的代码没有被正确管理,可能会导致内存泄漏,因此在不再需要时应通过`clearTimeout`或`clearInterval`来清除定时器。 `setTimeout`和`setInterval`之间的一个显著区别是执行次数。`setTimeout`...

    Java Script中setinterval怎么用?怎么才能让setinterval停下来?.pdf

    有时候我们需要能够根据程序运行的情况来停止`setInterval`,这可以通过调用`clearInterval`函数实现。 #### `clearInterval`的基本语法 ```javascript clearInterval(intervalID); ``` - **intervalID**:由`...

    JavaScript中停止执行setInterval和setTimeout事件的方法

    (1)setInterval 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式,停止该方法可使用 clearInterval 方法。具体示例如下: 代码如下: &lt;html&gt; &lt;meta http-equiv=”Content-Type” content=”text...

    setInterval全面的介绍

    ### setInterval全面介绍 在JavaScript编程语言中,`setInterval`是一个非常重要的函数,它被广泛应用于各种场景,尤其是在处理定时任务、实现动画效果等方面。本文将对`setInterval`进行一次全面而深入的探讨,...

    超级简单利用setInterval设置定时自动跳转的例子

    不过,如果你确实有连续定时跳转的需求,可以使用`clearInterval`来取消定时器。 在实际应用中,为了提供更好的用户体验和避免异常情况,我们可能还需要加入一些额外的处理,比如在用户交互时清除定时器,或者在...

    浅谈vue 组件中的setInterval方法和window的不同

    1. 避免使用组件实例内的`setInterval`,而应使用`window.setInterval`以获取ID用于`clearInterval`。 2. 使用箭头函数避免`this`指向混乱。 3. 在组件的`mounted`钩子中启动定时器,并在`destroyed`或`...

    CSS3 translate实现轮播图丝滑般翻页,setInterval实现定时器等常见操作。

    为了提供更好的用户体验,通常还会添加暂停和恢复播放的功能,这可以通过`clearInterval`函数实现,当用户鼠标悬停在轮播图上时暂停定时器,离开时恢复。 在提供的"js-轮播图"文件中,可能包含了实现这些功能的...

Global site tag (gtag.js) - Google Analytics