我已经搜索了如何将setTimeOut
与for循环一起使用,但是对于如何在while循环中使用它并没有很多,我不明白为什么应该有很多不同。我已经编写了以下代码的一些变体,但是这个循环似乎会使浏览器崩溃:
while(src == '')
{
(function(){
setTimeout(function(){
src = $('#currentImage').val();
$("#img_"+imgIdx).attr('src',src);
}, 500);
});
}
为什么呢?
基本上我有一个动态创建的图像,其源属性有时需要加载,所以在我显示它之前,我需要继续检查它是否已加载,并且只有当它的路径在{{1}中可用时才需要},然后我显示它。
这个代码在我使用while循环之前工作正常,当我直接使用
时$('#currentImage')
但是如果加载速度更快,我不想让用户等待3秒,因此我将setTimeout(function(){
src = $('#currentImage').val();
$("#img_"+imgIdx).attr('src',src);
}, 3000);
置于while循环中并缩短其间隔,以便我只检查每半秒加载的路径。这有什么问题?
答案 0 :(得分:10)
while循环正在制造麻烦,就像jrdn指出的那样。也许你可以将setInterval和setTimeout结合起来,一旦src被填满,清除间隔。我在这里提供了一些示例代码来帮助,但我不确定它是否完全符合您的目标:
var src = '';
var intervalId = window.setInterval(
function () {
if (src == '') {
setTimeout(function () {
//src = $('#currentImage').val();
//$("#img_" + imgIdx).attr('src', src);
src = 'filled';
console.log('Changing source...');
clearInterval(intervalId);
}, 500);
}
console.log('on interval...');
}, 100);
console.log('stopped checking.');
希望这有帮助。
答案 1 :(得分:5)
问题可能是你没有每半秒检查一次。
setTimeout计划一个函数在将来运行,但它不会阻塞,它只是稍后运行。因此,在你的while循环中,你安排这些函数的运行速度与迭代while循环一样快,所以你可能正在创建大量的函数。
如果您确实要每半秒检查一次,请使用setInterval而不使用循环。
答案 2 :(得分:4)
谢谢大家 - 所有建议都有所帮助。最后我使用了setInterval,如下所示:
var timer;
// code generating dynamic image index and doing ajax, etc
var checker = function() {
var src = $('#currentImage').val();
if(src !== '') {
$('#img_' + imgIdx).attr('src', src);
clearInterval(timer);
}
};
timer = setInterval(checker, 500);