Question

是否可以停止当前作为setInterval运行的函数？

这是我的代码：

这是我正在调用的函数

function pull_light_status (lights_array) {
    $.getJSON( "resources/php/getjson.php", function( json ) {
        var vera_obj = json;
        $.each(lights_array,function(myindex, myvalue){
        var id_del_object = myvalue - 1;
        var variable_del_id = vera_obj.devices[id_del_object].states[0].variable;
        var status_del_id;
        if (variable_del_id == "Status"){
            status_del_id = vera_obj.devices[id_del_object].states[0].value;
        }else{
            variable_del_id = vera_obj.devices[id_del_object].states[1].variable;
            status_del_id = vera_obj.devices[id_del_object].states[1].value;    
        }
        if (status_del_id == "1"){
            $("#light"+myvalue).attr("src","resources/img/on_toggle.png");                  
        } else {
            $("#light"+myvalue).attr("src","resources/img/off_toggle.png");  
        }
            console.log("ID: " + myvalue + ">>>>> " + variable_del_id + ">>>>> " + status_del_id);
    })
    })     
}

当我进入“起居室部分”时，在主界面上的

我加载了html和函数“pull_lights_status”，并将间隔设置如下

$("#livingroom").click(function(){
    $(".roomsdbl").hide();
    $(".rooms").hide();
    $("#roomwrapper").css("display","block");
    $("#roomwrapper").load("resources/data/livingroom.html",function() {       


        lights_array = [23,24,25,26];


        //load pull_light_status
        pull_light_status(lights_array);
        setInterval(function(){
            pull_light_status(lights_array);
        },10000);



            $(".closebutton").click(function(){  // Close button
            $("#roomwrapper").hide();
            $(".roomsdbl").show();
            $(".rooms").show();
            }); 
    }) 
})

这将每10秒更新一次灯的状态。我遇到的问题是，当我关闭那个部分（实际上在使用.closebutton时隐藏）并且我转到另一个部分让我们说主要房间正在加载相同的pull_light_status函数，然后每隔10秒它将去取两次状态每当我关闭并打开一个部分时，即使它相同，它也会添加另一个setInterval。

当我点击Living rooom上的.closebutton来阻止pull_light_status在后台运行时，以及加载房间时只需加载一个。

我不知道我是否正确解释了自己。我的编码技巧不是很好，所以代码可能是混乱的，重复的，即学习过程

亲切的问候，

Answer 1

使用setInterval后，您可以使用clearInterval停止

var pullInterval = setInterval(fn, 10000);

// some later time ...
clearInterval(pullInterval);

在任何时候，如果您想重新开始间隔，只需再次使用setInterval。

Answer 2

存储setInterval调用的结果值，并使用clearInterval停止进一步执行间隔。

Answer 3

创建一个全局变量，它可以存储您的计时器引用，然后在关闭按钮单击事件中执行clearinterval。

var lightTimer = null; //global variable
 $("#livingroom").click(function() 
 {
    $(".roomsdbl").hide();
    $(".rooms").hide();
    $("#roomwrapper").css("display", "block");
    $("#roomwrapper").load("resources/data/livingroom.html", function() {
        lights_array = [23, 24, 25, 26];


        //load pull_light_status
        pull_light_status(lights_array);
        lightTimer = setInterval(function() {
            pull_light_status(lights_array);
        }, 10000);
    });
}); `

为什么不把关闭按钮留在客厅活动之外？

$(".closebutton").click(function() { // Close button
    $("#roomwrapper").hide();
    $(".roomsdbl").show();
    $(".rooms").show();
    clearInterval(lightTimer); //this will immediately stop your timer
});

停止JavaScript间隔

3 个答案: