在ajax后显示加载div

我有一个主要使用JQuery Mobile的移动应用程序。我有一个使用POST的ajax函数，当我点击click事件时，我似乎无法获得任何效果。我试着设置在ajax后显示加载div

$('#cover').show();

在函数的第一件事，然后我不喜欢的document.getElementById（“用户”）等一些基本的东西设置一些变量，并检查输入，但只要AJAX功能它不会显示JQ Mobile的div甚至是微调。除非我调试并逐步完成代码，否则微调器和div显示正常。我尝试了setTimeout并将它放入ajax调用的beforeSend区域。一切正常，否则。看起来GET的效果好一些，我不确定这是否与它有关。

$.ajax({     
    cache: false, 
    type: "POST", 
    async: false, 
    url: urlString, 
    data: jsonstring, 
    contentType: "application/json", 
    dataType: "json", 
    success: function (data) { 
     JSONobj = JSON.parse(data);   
    }, 
    beforeSend: function(xhr){ 
      //console.log('BeforeSend'); 
    }, 
    complete: function (xhr) { 
     //console.log('Complete'); 
    }, 
    error: function (xhr, status, error) { 
     console.log(error); 
    } 
});

来源

2012-07-11 Jason

您在指定'async：false'将其变成同步呼叫。你应该让你的“加载”div完全出现在进行非Ajax调用之前。哦，这个页面在通话过程中可能会冻结，主要是因为它被冻结。 – TheZ 2012-07-11 19:55:55

并且当你有$（“＃id”）时不要使用document.getElementById – mplungjan 2012-07-11 19:58:57

我之前想过async：true，我会再试一次。我想我必须在那里加载所有的对象属性，而不是在一个单独的函数中。 – Jason 2012-07-11 20:01:45

试试这个

$("#someButton").click(function(e){ 

    e.preventDefault() //if you want to prevent default action 

    $('#cover').fadeIn(100,function(){ 

     $.ajax({  
       url: "someurl", 
       data: "Somedata", 
       contentType: "application/json", 
       dataType: "json",   
       }, 
       success: function (data) { 
        JSONobj = JSON.parse(data); 
        $('#cover').fadeOut(100);   
       }, 
       complete: function (xhr) { 
        $('#cover').fadeOut(100); 
       } 
     }); 

    }); 

});

来源

2012-07-11 19:59:36 Shyju

您可以使用Ajax的全局处理程序来处理这个问题：

$(document). 
    .ajaxStart(function(){ 
     $('#cover').show(); 
    }) 
    .ajaxStop(function(){ 
     $('#cover').hide(); 
    });

这样你就不必担心显示/隐藏覆盖上单独的Ajax调用。

来源

2012-07-12 09:32:47

在ajax后显示加载div

回答

相关问题