1

在特定页面的应用程序中，我连续使用 AJAX 函数调用，如下所示，

<script type="text/javascript">  
        $(document).ready(function(){   


            setInterval(function() {
                 $.ajax({  
                    url:'clmcontrol_livematchupdate',
                    type:'post', 
                    dataType: 'json',  
                    success: function(data) {  


                        $('#lblbattingteam').html(data.battingnow);
                        $('#lblscore').html(data.score);
                        $('#lblwickets').html(data.wickets);
                        $('#lblovers').html(data.overs);
                        $('#lblballs').html(data.balls);
                        $('#lblextras').html(data.extras);
                        $('#lblrr').html(data.runrate);

                        $('#lblbowlingteam').html(data.bowlingnow);
                        $('#lblbowler').html(data.currentbowler);
                        $('#lblbowlerovers').html(data.bowlerovers);
                        $('#lblbowlerballs').html(data.bowlerballs);
                        $('#lblrunsgiven').html(data.runsgiven);
                        $('#lblextrasgiven').html(data.extrasgiven);
                        $('#lblwicketstaken').html(data.wicketstaken);
                        $('#lblecon').html(data.econ);


                    }  
                });  
            }, 4000);
        });  
    </script>

无论如何，在第一次尝试时，应用程序运行良好并且值得到了我预期的更新，但经过几次尝试后，值难以更新并且没有发生进一步的更新。是不是因为连续的ajax调用，函数减慢了系统速度？

4

2 回答 2

1

最好不要使用 setInterval() 因为如果第一个请求尚未完成并启动另一个请求，您最终可能会遇到多个请求消耗共享资源并互相饿死的情况。您可以通过等待安排下一个请求直到最后一个请求完成来避免此问题。

试试看嘛：

(function ajaxInterval() {
      $.ajax({  
                url:'clmcontrol_livematchupdate',
                type:'post', 
                dataType: 'json',  
                success: function(data) {  


                    $('#lblbattingteam').html(data.battingnow);
                    $('#lblscore').html(data.score);
                    $('#lblwickets').html(data.wickets);
                    $('#lblovers').html(data.overs);
                    $('#lblballs').html(data.balls);
                    $('#lblextras').html(data.extras);
                    $('#lblrr').html(data.runrate);

                    $('#lblbowlingteam').html(data.bowlingnow);
                    $('#lblbowler').html(data.currentbowler);
                    $('#lblbowlerovers').html(data.bowlerovers);
                    $('#lblbowlerballs').html(data.bowlerballs);
                    $('#lblrunsgiven').html(data.runsgiven);
                    $('#lblextrasgiven').html(data.extrasgiven);
                    $('#lblwicketstaken').html(data.wicketstaken);
                    $('#lblecon').html(data.econ);


                },
                complete: function() {
                  // Schedule the next request when the current one has been completed
                  setTimeout(ajaxInterval, 4000);
                }  
            });
})();
于 2013-11-14T18:13:56.260 回答
0

如果您从调试器检查网络调用，这里有一个明显的潜在问题。由于 ajax 调用的非阻塞异步行为，您有可能同时进行 ajax 调用。根据您的浏览器，您只能同时拨打这么多电话，以便他们排队。在这些情况下，也不能保证执行顺序。

在您的情况下，我会设置async: falseajax 选项。通过在 setInterval 回调中执行，您已经获得了非接口阻塞行为。由于 setInterval 只是在方法调用之间应用一个计时器，因此您在给定时间永远不会有超过一个 ajax 调用运行（这可能是您问题的罪魁祸首）。

于 2013-11-14T18:11:56.410 回答