Question

$('.item').click(function(){
myFunc();
});

function myFunc(){
$.ajax({
success: function (data) { //call API },
beforeSend: function() {  $('.loading').css({'display':'block!important'}); },
complete: function () { $('.loading').css({'display':'none !important'});},
})
}

beforeSend中的代码不起作用，成功排在第一位。这很奇怪，应该先beforeSend执行。我尝试在显示加载之前放置alert()，加载确实出现了。这有什么不对？

Answer 1

function myFunc{
    $.ajax({
        url: "http://abcd.com",
        beforeSend: function(){
            $('.loading').css({'display':'block!important'});
        }
    })
    .done(function(data){
        //Call API
        $('.loading').css({'display':'none !important'});
    })
}

Answer 2

您正在评论},

success: function (data) { //call API },
//                                    ^ this is commented out

和

beforeSend: function() {  $('.loading').css({'display':'block!important'})
//                                     You need a space here ^

Answer 3

杰森请更新你的剧本

 $('.item').click(function(){
    myFunc();
    });

    function myFunc(){
    $.ajax({
    success: function (data) { 
   //call API 
   },
    beforeSend: function() {  $('.loading').css({'display':'block!important'});
alert("Before Send Function Call");
 },
    complete: function () { $('.loading').css({'display':'none !important'});},
    })
    }

Answer 4

我的想法是，在Ajax调用之前创建可见的加载div。再次使其在成功块中不可见。下面的示例代码。希望它能解决你的问题。

$('.item').click(function(){
    myFunc();
    });

    function myFunc(){
    // before calling ajax make it visible
    $('.loading').css({'display':'block!important'});
    $.ajax({
        type: "POST",
        url:"http://example.com/api/responce.php",
        data:{"u_email":email,"u_pwd":pass},
    }).success(function(res){
      // make it invisible
      $('.loading').css({'display':'none!important'});
      //do whatever with the responce from api
    }).error(function()(
      //handle ajax error if any
    ));

ajax beforeSend不按流程执行

4 个答案: