Question

我知道有很多这样的问题，但我没有为我找到合适的解决方案。

我使用ajax调用API所以我的问题是我的网页没有响应所以我发现这只是因为不正确的ajax处理你可以请帮助知道我在哪里放我的ajax.I需要ajax在页面加载时调用。

我试过调用没有任何函数的ajax ......

show('ajax Call start for player');
$('#loading').show();
$.ajax({
    url: '/home/getPlayers',
    success: function (data) {
        data = JSON.parse(data);
        playerData = data.Data;
        show('data of player');
//        show(playerData);

        showPlayers(1);
        show('ajax Call complete for player');
        flag = 1;
    }
});

show('ajax Call start for loadplayeronpitch');

$.ajax({
    url: '/home/checkUserTeam',
    success: function (data) {

        while (true) {
            if (flag) {
                loadUserTeampitch(data);
                break;
            }
        }
        show('ajax Call complete for loadplayeronpitch');
    }
});

这不起作用导致无响应的页面。

然后从其他问题我尝试在以下函数中调用ajax

$(document).load(function(){

});
$(function(){

});
$(document).bind("load", function () {

});

但这一切都无法正常工作你能帮助我吗？

谢谢。

Answer 1

这应该像你想要的那样工作，但我现在无法测试它。

$('#loading').show();
var deferedA = $.ajax({
    url: '/home/getPlayers',
    success: function (data) {
        data = JSON.parse(data);
        playerData = data.Data;
        show('data of player');
//        show(playerData);

        showPlayers(1);
        show('ajax Call complete for player');
    }
});

show('ajax Call start for loadplayeronpitch');

var deferedB = $.ajax({
    url: '/home/checkUserTeam'
});

//wait until both request are finished
$.when(deferedA, deferedB)
.done( function (dataA, dataB) {
    loadUserTeampitch(dataB);
    show('ajax Call complete for loadplayeronpitch');
});

编辑我建议使用Promise代替$.when（承诺实现jQuery有点奇怪），但<使用Promise的问题是仅适用于较新的浏览器，对于较旧的浏览器，您需要使用bluebird或when

等库

Answer 2

无响应是由您的while(true)循环引起的，所以永远不要再这样做了： - ）

您要做的是：仅在第一个ajax调用完成后运行第二个ajax调用。因此，您应该将两个ajax调用放入单独的函数中，然后在页面加载时调用第一个函数。

在第一个ajax的成功部分（在第一个函数内），调用第二个函数。完成。

function firstAjax() {
   $.ajax({
       url: '/home/getPlayers',
       success: function (data) {
           data = JSON.parse(data);
           playerData = data.Data;
           show('data of player');
           //show(playerData);

           showPlayers(1);
           show('ajax Call complete for player');
           secondAjax();
       }
   });
}

function secondAjax() {
   $.ajax({
       url: '/home/checkUserTeam',
       success: function (data) {
          loadUserTeampitch(data);
       }
   });
}

$(function() {
  firstAjax();
});

Answer 3

编辑：如果你想简单，可以使用以下方法..

<script type="text/javascript">
    $(function() {
        var flag = 0;
        var data1;

        $('#loading').show();
        $.ajax({
            beforeSend: function() {
                show('ajax Call start for player');
            },
            url: '/home/getPlayers',
            success: function(data) {
                flag++;
                data = JSON.parse(data);
                playerData = data.Data;
                show('data of player');
                showPlayers(1);
                show('ajax Call complete for player');
                checkFlag();
            }
        });

        $.ajax({
            beforeSend: function() {
                show('ajax Call start for loadplayeronpitch');
            },
            url: '/home/checkUserTeam',
            success: function(data) {
                flag++;
                data1 = data;
                show('ajax Call complete for loadplayeronpitch');
                checkFlag();
            }
        });

        function checkFlag()
        {
            if (parseInt(flag) == parseInt(2))
            {
                loadUserTeampitch(data1);
            }
        }

    });
</script>

调用ajax调用API的最佳位置是什么？

3 个答案: