Question

1）如何使while循环在后台运行，并且尽管while循环，网页仍会响应用户点击。如果我启动循环中生成的字符，我无法将数据输入“输入”，因为生成循环占用了所有资源。实际上，每当我点击“开始”时，我都会收到网页没有响应的消息，询问我是否要停止它。选择“停止”后，我看到生成了字符。然而，很难将字符输入到输入字段并使用“停止”触发器停止程序，并且通常网页崩溃。

2）如何使多个jquery while循环同时运行，此外，网页应该响应并且可供用户访问。

<!DOCTYPE html>
<html>
    <head>
<script src="theme/assets/js/jquery/jquery-2.2.3.min.js"></script>
    </head>
    <body>
        <div id="Start"> <b> Start </b> </div>
        <div id="Stop"> <b> Stop </b> </div>
        <br><br> <div id="random"> </div>
        <br><br>  <input id="input" type="text" size="500"> 

        <script>
// how to manage without global variables? how to pass variables to the function
        var flag = false;
        var charstr = "zxcvbnm,\.\/asdfghjkl;\'qwertyuiop[]\\`ąčęėįšųū90\-ž";
        var charstrL = charstr.length;

    $("#Start").click( function() {
        $("#lesson").text("clicked Start");
        flag =true;
        $(this).val('flag');
        while(flag){
            setInterval(function() { // this code is executed every 500 milliseconds:
                var rand = Math.random();
                var num =  Math.floor( ( Math.random() * (charstr.length -1) ) );
                $("#lesson").text(charstr[num]);
            }, 500);
        }//while
     }); // $("#Start").click( function() {

    $("#Stop").click( function(){
        flag=false;
        $(this).val('flag');
        alert('clicked Stop');
    }); 

    </script>
  </body>
</html>

Answer 1

如果进行DOM操作，则无法在后台运行while (flag) { setInterval(function() { // this code is executed every 500 milliseconds: var rand = Math.random(); var num = Math.floor( ( Math.random() * (charstr.length -1) ) ); $("#lesson").text(charstr[num]); }, 500); }循环，因为浏览器JavaScript中只有一个主要的UI主线程。

你也可能不想，因为这段代码：

setInterval

不断添加其他计时器，每隔500毫秒调用一次该代码。在很短的时间内，您的浏览器将完全无响应。

只需设置flag，并让内部代码决定是否根据setInterval(function() { // this code is executed every 500 milliseconds: if (flag) { var rand = Math.random(); var num = Math.floor( ( Math.random() * (charstr.length -1) ) ); $("#lesson").text(charstr[num]); } }, 500);运行：

import Quartz

let url = NSBundle.mainBundle().URLForResource("test", withExtension: "pdf")
let pdf = PDFDocument(URL: url)
print(pdf.string())

你可以拥有其中的几个，但是如果你有很多，那么你可能会考虑减少并且每次只做一件事。< / p>

Answer 2

这是一个程序的工作示例，提示用户使用setInterval函数而不是while loop输入字符。该应用程序是为了提高打字技巧。

<!DOCTYPE html>
<html>
    <head>
<script src="theme/assets/js/jquery/jquery-2.2.3.min.js">  </script>
    </head>
    <body>

<div id="Start"> <b> Start </b> </div> 

<br><div id="lesson"> </div>
<input id="input" type="text" size="500"> 

<span id="Stop">  Stop  </span>
<span id="Clear"> &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; 
  &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;    Clear     </span>

        <script>
// how to manage without global variables ? how to pass vaiables to the function
        var flag = false;
        var charstr = "zxcvbnm,\.\/asdfghjkl;\'qwertyuiop[]\\`ąčęėįšųū90\-ž";
        var charstrL = charstr.length;

    $("#Start").click( function() {
        flag =true;
        $(this).val('flag');
        if(flag){
            setInterval( function() { // this code is executed every 500 milliseconds:
            if (flag) {
                var rand = Math.random();
                var num =  Math.floor( ( Math.random() * (charstr.length -1) ) );
                $("#lesson").text("\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0"+charstr[num]);
            } //if (flag) {
            }, 500);
        } // if (flag)
     }); // $("#Start").click( function() {     

    /*    
   // does not work, because creates infinite loops, each with 500ms waiting time. 
   // In miliseconds this accumulates to hours and thousands of loops generated usign while
        while(flag){
            setInterval(function() { // this code is executed every 500 milliseconds:
                var rand = Math.random();
                var num =  Math.floor( ( Math.random() * (charstr.length -1) ) );
                $("#lesson").text(charstr[num]);
            }, 500);
        }//while */

   //

    $("#Stop").click( function(){
        flag=false;
        $(this).val('flag');
    }); 


    $("#Clear").click( function(){
        $("#input").val(''); 
        $("#lesson").text(' '); 
    });     

    </script>
  </body>
</html>

jquery，while循环在后台运行，同时循环

2 个答案: