2

当通过 ajax 加载 json 数据时，我遇到了一些奇怪的行为。数据加载正常，只有在几个间隔之后数据才会打乱并在间隔之间保持运行。这甚至会导致浏览器崩溃

html页面 

<script id="source" language="javascript" type="text/javascript">
$(function ahitRate() 
{
    $.ajax({
    cache: false,
    url: 'average.php',
    data: 'jsonData',
    dataType: 'json',
    processData: false,
    success: function(data)
            {
                var ahr = data[0];              //get id
                var hitRate = data[1];           //get name
                $('#output').html("<b>id: </b>"+ahr+"<b> name:   </b>"+hitRate); 
                setInterval(ahitRate, 5000);
                }           
    });
}); 
</script>

生成随机数据的json php代码 

// Session
session_start();

// Set the JSON header
header("Content-type: text/json");
header('Cache-Control: no-cache, must-revalidate');

$y = rand(0, 100);

// Create a PHP array and echo it as JSON
$ret = array("Average", $y);
echo json_encode($ret);
?>

任何建议如何解决这个问题？

4

2 回答 2

2

我的天啊！

您正在递归调用它！

setInterval(ahitRate, 5000);

编辑：只需将 setInterval(...) 更改为 setTimeout(ahitRate, 5000);

每次执行的时候，老的一直在运行，又会添加一个新的，所以它会使用越来越多的内存！

$(function() {
    function ahitRate() 
    {
         $.ajax({
         cache: false,
         url: 'average.php',
         data: 'jsonData',
         dataType: 'json',
         processData: false,
         success: function(data)
                    {
                         var ahr = data[0];              //get id
                         var hitRate = data[1];           //get name
                         $('#output').html("<b>id: </b>"+ahr+"<b> name:   </b>"+hitRate); 
                         }           
         });
    } 

    setInterval(ahitRate, 5000);

});

唯一不同的是我：

  1. 从 ajax 成功函数中删除了 setInterval(...) 方法
  2. 在闭包结束时恰好调用了一次（“$(function() { ... } );”

这将导致您的“ahitRate()”函数每 5 秒被调用一次。

于 2012-05-02T00:30:48.767 回答
1

setInterval 不断触发 - 每次收到新响应时，您都会启动一个新计时器。因此，五秒钟后，第一个计时器触发并启动另一个计时器。然后在十秒钟后，两个计时器都会启动，然后再启动两个。

我想你可以看到这是怎么回事。

我认为您正在寻找 setTimeout() 方法，或者只是在成功函数之外启动间隔计时器，因此它永远不会被再次调用。

于 2012-05-02T00:31:53.760 回答