Question

在我在特定页面中的应用程序中，我连续使用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调用，函数会降低系统的速度吗？

Answer 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);
                }  
            });
})();

Answer 2

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

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

定期间隔内的AJAX函数调用是否会降低应用程序的速度？

2 个答案: