Question

尝试在发送ajax post请求时显示加载div。试过这些代码它不起作用。请帮我解决这个问题。

$(document).ready(function() {
    $('a.pagerlink').click(function(event){
        var id = $(this).attr('id');

        beforeSend: function() {
            $('#load').show();
        },
        complete: function() {
            $('#load').hide();
        },
        $.post(
                "invited-friends",
                { gameid: id },
         function(data) {
               $('#middlefriends').html(data);
          }

        );
    });
});

我的html代码

正在加载

     <a id="1" class="pagerlink" >hi</a>

我希望在div帖子发生时显示负载ajax。请求完成后隐藏加载div。

Answer 1

您可以使用.ajaxStart和.ajaxStop方法：

var loading = $("#load");
$(document).on({
    ajaxStart: function () { loading.show(); },
    ajaxStop : function () { loading.hide(); }
});

Answer 2

你做错了。如果您正在尝试进行ajax调用，那么它应该是这样的

$.ajax({
    url:"invited-friends",
    data: { gameid: id },
    type:'POST',
    success:function(data) {
        $('#middlefriends').html(data);
    },
    error: function(data) {
        console.log(data);
    },
    beforeSend: function() {
        $('#load').show();
    },
    complete: function() {
        $('#load').hide();
    }
});

Answer 3

这是修改后的代码： -

$(document).ready(function() {
    $('a.pagerlink').click(function(event){
        var id = $(this).attr('id');
        $('#load').show();
        $.post("invited-friends", { gameid: id }, function(data) {
            $('#load').hide();
            $('#middlefriends').html(data);
        });
    });
});

显示加载窗口jquery

3 个答案: