循环后响应按钮

Question

我有一个应用程序使用jQuery的迭代通过一系列的复选框。

当它迭代时，我有一个对话框显示打印会话的状态。我也有一个取消按钮来取消会话。

<input type="button" id="cancelButton" onclick="cancel()"> 

    function cancel() { 
     stop = true; 
    } 

每次迭代我检查，如果stop是真实的，如果是这样，我打破了循环。但问题是，如果在会话期间按取消按钮，取消功能将只会在.each循环之后运行（这是违背目的的一种方式）。有没有办法让按钮更具响应性或更好的方法来处理这个问题？

Answer 1

在单独的线程中运行函数？

setTimeout(function() { $('[name=check]:checked').each(function() { 
    printingFunction(); 
}); }, 1); 

Answer 2

您可以连锁setTimeout s，以便可以检查停止。你仍然需要等待当前的操作完成，但它会让你跳出循环。

function next() 
{ 
    printingFunction(); 
    if (!stop && someOtherCheck) 
     setTimeout(function() { next(); }, 1); 
} 

next(); 

Answer 3

我不认为你可以中断.each环路JavaScript执行是单线程的。

但是我觉得定时器执行异步，你可以尝试像下面取消和明确的。

像下面的逻辑可能会让你在那里。

var timeouts = []; 

$.each(someArray, function(index, value){ 
    timeouts.push(setTimeout(function(){ 
      console.log(index); 
    },5000*index)); 
}); 


$('#cancel-button').click(function(){ 
    $.each(timeouts, function (_, id) { 
     clearTimeout(id); 
    }); 

    timeouts = []; 
}): 

此外，你可以考虑用.index()玩，如果上面没有帮助。

Answer 4

再试一次 - 我做了更改移位语句，将清除错误的IE 11：

var ele = Array.prototype.shift.call($checked); 

您需要使用的setTimeout在每个循环调用（可设定为0），因此取消功能得到执行的机会 - 这样的事情：

function cancel() { 
    stop = true; 
} 
function printingFunction() { 
    var x = 0; 
    while (x < 10000){ 
     x+=1; 
    } 
} 

function printLoop($checked) { 
    if (stop) { 
     console.log('Stopped - button pushed') 
    } else { 
     if ($checked.length > 0) { 
      var ele = Array.prototype.shift.call($checked); 
      printingFunction() 
     } 
     if ($checked.length > 0) { 
      setTimeout(function(){printLoop($checked)}, 0); 
     } else { 
      console.log('Stopped - array depleted') 
     } 

    } 

} 

var stop = false, 
     $checked = $('[name=check]:checked'); 

printLoop($checked)