Question

我正在尝试运行一个javascript，将页面的背景颜色设置为红色，等待秒，然后从网页获取值，然后变为绿色，然后保持绿色这么多秒，然后再次变为红色并无限期重复。

使用JQuery GET获取网页。

我的代码

<script>
        function g() {
            document.body.bgColor = 'green';
        }
function r() {
            document.body.bgColor = 'red';
        }


 $(document).ready(function(){

     while(1)
     {
    $.get("http://localhost:8080/t.html", function( data ){
        setTimeout'g()',10000);

        setTimeout('r()',data*1000);

        });



     }

 });
    </script>

问题：不知何故，seTimeout导致循环继续。当页面等待几秒钟时，会生成数百个GET请求。当代码等待给定时间时，我需要完整的进程来冻结。我的浏览器正在检测这个连续循环，因为活动繁重并要求杀死它。

请帮我解决这个问题。

Answer 1

setTimeout不会冻结你的while函数，因为它的异步。它只会在给定时间后等待并执行g()。

setInterval(function() {
    $.get("http://localhost:8080/t.html", function( data ){
     if(data=="green") g(); 
     else r();
    });
},10000);

这将每10秒执行一次GET-Request，并将背景设置为绿色，data为绿色，否则为红色。

我并不完全理解你想要达到的目标，所以你需要稍微修改一下。

Answer 2

请看看

 <script>
            function g() {
                document.body.bgColor = 'green';
            }
            function r() {
                document.body.bgColor = 'red';
            }


     $(document).ready(function(){

        function changeBG()
        {
         $.get("http://localhost:8080/t.html", function( data )
         {
               setTimeout('g()',10000);
               setTimeout('r()',data*1000);
               changeBG();
         });

        }
     changeBG();
     });

     </script>

Answer 3

试试这个，

$(function(){
  r();
});
function r(){    
    var timeOut = 5000;
    if(document.body.bgColor=='green'){
         document.body.bgColor = 'red';
           timeOut = 10000;
    }else{
        document.body.bgColor = 'green';        
    }    
    setTimeout(r,timeOut);
}

DEMO： http://jsfiddle.net/Hnuy8/

使用setTimeout时，防止在循环内重复GET

3 个答案: