试图在jQuery中延迟/暂停/减慢while循环 [英] Trying to delay/pause/slow a while loop in jQuery

问题描述

我看了很多，但还没有找到答案。也许它只是无法完成的事情。

I have looked around a lot, and not found the answer yet. Maybe it is simply something that cannot be done.

我是jQuery和JavaScript的新手。只是为了测试我正在尝试创建一个脚本的限制，该脚本将在未选中复选框的情况下将列表项连续附加到未排序的列表。我知道在查找是否选中了复选框时，我的while语句可能没有正确，但我现在遇到的主要问题是while循环的运行速度比浏览器可以跟上的速度快，锁定了页面，最终我必须杀死浏览器。我已经阅读了很多关于setTimeout和setInterval的例子，但是我不断看到的是那些只能用于for / next样式循环的东西，其中循环依赖于变量进行预定量的循环。我不想要这个。我希望循环继续，直到我选中该框然后它应该停止。所以我正在寻找一种暂停循环或减慢循环的方法1）我可以看到每个列表项附加到页面上，2）脚本将给我一个机会通过在运行之前选中框来结束它浏览器冻结/自杀。

I am new to jQuery and JavaScript. Just to test the limitations I am trying to create a script that will continuously append a list item to an un-ordered list while a check box is not checked. I know I may not have my while statement correct in searching if the checkbox is checked or not, but the main issue I am having at the moment is the while loop starts running faster than the browser can keep up, locks up the page, and eventually I have to kill the browser. I have read many examples on setTimeout and setInterval, but what I continuously see is those only work with a for/next style loop, where the loop goes for a predetermined amount of cycles dependent upon a variable. I do not want this. I want the loop to continue until I check the box and then it should stop. So I am looking for a way to pause the loop or slow it down so 1) I can see each list item appended to the page, and 2) the script will give me a chance to end it by checking the box before it runs the browser to freeze/suicide.

提前致谢，代码如下。

$(function(){
    $(document).ready(function() {loopLi();});
        var i = $('#jlist li').size();
        console.log(i);

        function loopLi() {
            while($('#Chckbox').not(":checked") ) {
                setInterval(function(){
                    i++;
                    $('<li>' + i + '</li>').appendTo('#jlist');
                }, 5000);
            }
        }
});

编辑：谢谢大家。搞定了。没有意识到while循环会同时多次运行代码。这一切都是为了工作而学习的，而我们目前所拥有的这本书并未深入探讨这些内容。目前使用jQuery：新手到忍者。还有什么我们应该看看来回答这些问题，或者这只是与它一起工作的东西？

Thank you all. Got it working. Did not realize that a while loop would run the code multiple times at the same time. This is all being learned for work, and the book we currently have does not go this in depth with stuff. Currently using jQuery: Novice to Ninja. Anything else we should look at to answer these kinds of questions, or is this just something that comes with working with it?

推荐答案

您现在创建了无限的间隔 - 只要执行而循环，它就会创建一个新的，因此浏览器总是很忙，无法响应复选框单击。只需一个间隔即可。

You're now creating an infinite amount of intervals - as long as the while loop is executed it creates a new one and the browser is therefore always busy and cannot respond to a checkbox click. Just one interval is enough.

此外，你应该使用！ .is（）因为 .not 返回一个jQuery对象，它始终是真的，即传递 if / while 。

Also, you ought to use ! .is() because .not returns a jQuery object, which is always truthy, i.e. passing the if/while.

http://jsfiddle.net/rUAKx/

var i = 0;

function loopLi() {
    setInterval(function() { // this code is executed every 500 milliseconds:

        if(!$('#Chckbox').is(":checked")) {
            i++;
            $('<li>' + i + '</li>').appendTo('#jlist');
        }

    }, 500);
}

$(loopLi);

这篇关于试图在jQuery中延迟/暂停/减慢while循环的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！