setInterval返回值

时间:2017-09-21 14:26:00

标签: javascript dom closures setinterval

我正在使用setInveral函数,我想访问在间隔期间计算的值并稍后返回它们。

函数本身,查看元素是否已完成加载(通过Ajax)一段时间,然后返回该元素的JSON解析(如果它已完成)(或返回空白)。 元素可能在200ms或1s后完成加载。为了尽可能最快,我实际上使用的是setInterval。

我的功能如下:

window.ObjectBuilding = function (id){ /*function to check the element & 
return Object*/
/*Set max number of loop*/
var dl_cap = 5;
/*Set the intervals (in milliseconds) on how often to execute the code*/
var dl_int = 200;
/*Counter*/
var check_dl_inc = 0;
/*initiate global var*/
window.temp_object='';
check = setInterval(function(){
    el = window.document.getElementById(id);
    if(el){
        if(el.innerHTML.length > 50){
            /*Object ready*/
            temp_object= JSON.parse(el.innerHTML);
            clearInterval(check);
        }else{
            /*Oject not yet ready*/
            check_dl_inc++;
            if(check_dl_inc == dl_cap){
                temp_object= "";
                clearInterval(check );
                }
        }
    }else{
        /*Missing Dom element*/
        temp_object= "";
        clearInterval(check );
    }
}, dl_int);
return temp_object
}

我们的想法是将此对象用于我网站上的多个位置,例如: object = ObjectBuilding('myID')

我遇到的问题是temp_object永远不会使用最新值更新。它始终保持为初始状态。

我认为这是一个封闭的事情,但我没有办法解决它。 SetInterval返回值是时态对象的ID,所以我无法得到它。

2 个答案:

答案 0 :(得分:0)

我认为使用Promises是个好主意。

let promise = new Promise(function(resolve){

   let check = setInterval(function(){
      el = window.document.getElementById(id);
      if(el){
         if(el.innerHTML.length > 50){
            /*Object ready*/
            temp_object= JSON.parse(el.innerHTML);
            clearInterval(check);
            resolve(temp_object);

            ...

});

promise.then(function(temp_object){
    // Do all yuor needs here
    console.log(temp_object);
});

所有现代浏览器都支持“盒子中的Promises”。或者您可以使用Bluebird来支持旧版本。你也可以在几个周期后使用promise rejecton。

没有承诺你就可以使用回调函数来完成所有工作。

答案 1 :(得分:0)

您正在返回 temp_object ,但计时器启动并稍后执行。因此返回值在返回时仍为空字符串。

如果您想更新您的页面,请调用函数而不是尝试返回:

function updateMyPage(temp_object) { 
    // update your page here, now you have the updated value in temp_object
}

window.ObjectBuilding = function (id){ /*function to check the element & 
return Object*/
/*Set max number of loop*/
var dl_cap = 5;
/*Set the intervals (in milliseconds) on how often to execute the code*/
var dl_int = 200;
/*Counter*/
var check_dl_inc = 0;
/*initiate global var*/
check = setInterval(function(){
    el = window.document.getElementById(id);
    if(el){
        if(el.innerHTML.length > 50){
            /*Object ready*/
            updateMyPage(JSON.parse(el.innerHTML));
            clearInterval(check);
        }else{
            /*Oject not yet ready*/
            check_dl_inc++;
            if(check_dl_inc == dl_cap){
                updateMyPage("");
                clearInterval(check );
                }
        }
    }else{
        /*Missing Dom element*/
        updateMyPage("");
        clearInterval(check );
    }
}, dl_int);
}