在循环中暂停和恢复setTimeout

我有以下$ .each循环遍历一个对象。 每隔5秒调用一次get_file（）函数。 无论如何都包括暂停和恢复选项。 因此，如果我单击暂停，数据的加载将停止。 当然，当我点击“恢复”按钮时，它会从它停止的位置再次启动。

希望有人能提供帮助。

$.each(obj, function (i, v) { setTimeout(function () { file = v.new_file; var timeline_date = moment(v.last_modified_date).format("dddd, MMMM Do YYYY, h:mm:ss a"); bHover = 0; //re-highlight links $(".timeline_msg").html(timeline_date); get_file(file); }, 5000 * (i + 1)); }); 

Answer 1

创建所有计时器的数组，以便在单击暂停按钮时清除它们。 使用全局变量来跟踪要加载的文件列表的位置。 然后你可以从你离开的地方恢复。

 var curfile = 0; var load_file_timers; function load_files() { load_file_timers = obj.map(function(v, i) { if (i < curfile) { return null; } else { return setTimeout(function() { var file = v.newfile; var timeline_date = moment(v.last_modified_date).format("dddd, MMMM Do YYYY, h:mm:ss a"); bHover = 0; //re-highlight links $(".timeline_msg").html(timeline_date); get_file(file); curfile++; }, 5000 * (i - curfile + 1)); } }); } load_files(); $("#pause").click(function() { $.each(load_file_timers, function(i, timer) { if (timer) { clearTimeout(timer); } }); }); $("#resume").click(load_files); 

Answer 2

当您调用setTimeout()您将返回该计时器的句柄，然后可以将该句柄传递给对clearTimeout()的调用。 这将取消计时器的后续触发（假设它尚未触发）。 这可以是与“暂停”选项相关联的代码。 当您想要恢复时，您可以再次执行相同的setTimeout()代码以恢复下一个间隔的计时器。

这个故事假定已经使用setTimeout()设置了一个计时器，并且暂停应该阻止计时器触发。

请参阅setTimeout 。

Answer 3

对此的递归解决方案是，

 var array = $.map(obj,function(v,i){ return v; }); var timer; var fileId=0; function execute(){ timer = setTimeout(function () { v = array[fileId]; var file = v.newfile; var timeline_date = moment(v.last_modified_date).format("dddd, MMMM Do YYYY, h:mm:ss a"); bHover = 0; //re-highlight links $(".timeline_msg").html(timeline_date); get_file(file); fileId++; if (array.length > fileId){ execute(); } }, 1000); } $('document').ready(function(){ $('#loop_controler').click(function(){ if (fileId < array.length){ if ($(this).text() == 'pause'){ clearTimeout(timer); $(this).text('resume'); } else { execute(); $(this).text('pause'); } } }); execute(array,0); });