Question

嗨，大家不确定这样做的最佳方法 - 即放置if的位置..我有一个加载页面并具有setInterval（）函数的div。

在加载的页面上有1个按钮，我想要实现的是当单击按钮＃1（加载的页面）以停止setInterval（）并追加一个新的div（绝对位置）直到按钮＃2（在单击附加的div）然后重新启动它。 .. comprende？

这是我的“基础”代码

这是第一个按钮的动作

 $('.replybutton').live('click',function(){
    $('.discussion').append('<div class="replyarea">some content in here plus "button number2</div>');
    });

这会加载页面 - 最初

$('.discussion').load('board2.php');

这是刷新功能

var auto_refresh = setInterval(
function()
    {
    $('.discussion').fadeOut().load('board2.php').fadeIn();

    }, 10000);

失败 - （但不是首选）我可以在加载的页面上使用切换而不是$('.replybutton').live('click',function()中使用的追加，但是仍然需要停止刷新并重新启动它 - 基于切换，但我强调切换思路不是首选方式。

Answer 1

我认为你要找的是函数clearInterval()。这样您就可以根据时间间隔ID（在您的情况下为auto_refresh）删除间隔。

以下是文档：https://developer.mozilla.org/en/DOM/window.clearInterval

现在你可以在命名函数中包装回调：

var reload = function(){
    $('.discussion').fadeOut().load('board2.php').fadeIn();
};

var auto_refresh = setInterval(reload, 10000);

$('button').click(function(){
    clearInterval(auto_refresh);
});

Answer 2

我在JSFiddle为你创建了一个例子。请在此处查看：http://jsfiddle.net/7YYV7/。

<强>代码

var intervalId = 0;
intervalId = setInterval(fadeDiscussion, 3000);

$(function() {
    $('input[name=click]').bind('click', function() {
        clearInterval(intervalId);     

        $('.discussion').append('<div class="replyarea">some content in here plus <input type="button" name="save" value="save"></div>');    
    });

    $('input[name=save]').live('click', function() {
         intervalId = setInterval(fadeDiscussion, 3000);   
    });
});

var i = 1;
function fadeDiscussion () {
    console.log(i);
    $('.discussion').fadeOut().fadeIn();
    i++;
}

JQuery自动刷新（setInterval）

2 个答案: