2012-07-11 79 views
0

我有一個主要使用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); 
    } 
}); 
+0

您在指定'async:false'將其變成同步呼叫。你應該讓你的「加載」div完全出現在進行非Ajax調用之前。哦,這個頁面在通話過程中可能會凍結,主要是因爲它被凍結。 – TheZ 2012-07-11 19:55:55

+0

並且當你有$(「#id」)時不要使用document.getElementById – mplungjan 2012-07-11 19:58:57

+0

我之前想過async:true,我會再試一次。我想我必須在那裏加載所有的對象屬性,而不是在一個單獨的函數中。 – Jason 2012-07-11 20:01:45

回答

0

試試這個

$("#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); 
       } 
     }); 

    }); 

}); 
1

您可以使用Ajax的全局處理程序來處理這個問題:

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

這樣你就不必擔心顯示/隱藏覆蓋上單獨的Ajax調用。