setInterval完成后如何传递变量?

时间:2013-09-09 22:15:36

标签: javascript jquery

我有以下代码。我开始的小提琴是我试图做的事情的孤立版本。

var height;
var count = 0;

var setHeight = setInterval(function() {   
    count++;
    console.log('count');
    if ( count  > 10)
    {
        console.log('done');
        height = 20;
        clearInterval(setHeight);   
    }
},100);

console.log('this is the height -> ' + height);

我期望(或希望发生)的是height = 20;的值在我的console.log中输出。最终目标是在清除间隔后从我的setInterval函数中检索变量。

现在我得到.. 这是身高 - >未定义

FIDDLE:

http://jsfiddle.net/GNvG6/8/

我想要完成的任务:

所以潜在的问题是这个。我有一个函数在DOM中加载一些元素之前运行。所以我要做的是继续运行该函数,直到该元素的实例存在。一旦发生这种情况,我就打算获得该元素的高度并将其移交给另一个变量。我不确定如果这会解决我的问题,但我想如果我可以让它工作,我至少可以测试它。

3 个答案:

答案 0 :(得分:1)

FIDDLE DEMO

var height = 0;                                        // initial value
var count = 0;

var setHeight = setInterval(function() {   
    count++;
    console.log('count and height is still:'+ height); // height is always 0
    if ( count  > 10){
        height = 20;
        console.log('done and height is:'+ height);    // height is finally 20
        clearInterval(setHeight);           
    }
},100);

答案 1 :(得分:1)

var height;
var count = 0;

var setHeight = setInterval(function() {   
    count++;
    console.log('count');
    if ( count  > 10)
    {
        console.log('done');
        height = 20;
        reportHeight(height);
        clearInterval(setHeight);   
    }
},100);

function reportHeight(height){
    console.log('this is the height -> ' + height);
}

控制台输出

(11) count
done
this is the height -> 20 

答案 2 :(得分:0)

当您使用jQuery时,您也可以使用$.Deferred

// wait for 3 + (0..2) seconds
setTimeout(function () {
    $(document.body).append($("<strong>hello</strong>"));
}, 3000 + 2000 * Math.random());

function waitFor(test, interval) {
    var dfd = $.Deferred();
    var count = 0;
    var id = setInterval(function () {
        console.log(count++);
        var val = test();
        if (undefined !== val) {
            clearInterval(id);
            dfd.resolve(val);
        }
    }, interval);
    return dfd.promise();
}

function waitForEl(selector, interval) {
    return waitFor(function () {
        var els = $(selector);
        return (els.length > 0) ? els : undefined;
    }, interval);
}

waitForEl("strong", 100).then(function (strong) {
    console.log(strong, strong.height());
});

Example in this jsfiddle