Ajax setInterval导致浏览器无响应

时间:2013-08-30 15:13:30

标签: jquery html ajax

我有以下测试代码:

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Ajax - one variable test</title>
 <style>
   body{ font-size: 12px; font-family: Arial;}
 </style>

<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<ol id="variable1"><var1></ol>

<script>
setInterval(function()
 {
  $("#variable1").load("ajax_v00.html")
 },3000);
</script>


</body>
</html>

我正在使用一个向var1报告状态的嵌入式Web服务器。

示例:Ok或Head Up

上面的内容正在崩溃我测试过的任何浏览器。有人可以看看我是否在做某事 错?

谢谢。

1 个答案:

答案 0 :(得分:2)

请求可能需要超过3秒才能执行,因此堆叠请求直到浏览器无法处理全部并崩溃...而不是使用间隔,您应该使用超时将在最后一个3秒后执行请求一个完成。这里:

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Ajax - one variable test</title>
 <style>
   body{ font-size: 12px; font-family: Arial;}
 </style>

<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<ol id="variable1"><var1></ol>

<script>
function doRefresh()
 {
  $.ajax({
     url:"ajax_v00.html",
     success:function(data){
         $("#variable1").html(data);
         setTimeout(doRefresh,3000);
     }
  });
}
setTimeout(doRefresh,3000);
</script>


</body>
</html>