在ipad上加載圖像不會顯示使用ajax

Question

我有一個網頁，運行ajax調用，在調用過程中顯示加載圖像。 這適用於Firefox，但不會在iPad上顯示。

我已經嘗試了幾種方法無濟於事，包括blockUI插件。

這是我的HTML/CSS

<style type="text/css"> 

.hidden { 
    display: none; 
} 

div.overlay { 
    position: absolute; 
    top: 0; 
    width: 100%; 
    height: 100%; 
    background-color: #fff; 
    opacity: 0.6; 
    z-index: 1; 
} 

div.overlay.standard { background: #fff url(images/site/loading.gif) no-repeat 50% 50%; } 

</style> 
<div id="holder" style="position:relative; height:90%; width:100%"> 
    <div id='map' style='width: 100%; height:100%; clear:both;'></div> 
    <div id="loading" class="overlay standard hidden"></div> 
    <div id="crosshair" class="overlay hidden"><img src="images/pins/crosshair.png" alt="crosshair"></div> 
</div> 

這是腳本：

$.ajax({ 
     url:"search_build_json.php", 
     cache:false, 
     async:false, 
     type:"POST", 
     dataType: "json", 
     data:{lat:cLat, lng:cLng, radius:radius} 
     beforeSend: function(){ 
      $('#loading').show(); 
     }, 
     complete: function(){ 
      $('#loading').hide(); 
     }, 
     success:function(data){ 
      //do stuff 

    }); 

一個例子可以在這裏看到 http://www.searchforsites.co.uk/json.htm

如果你沒有得到任何結果爲基礎在你住的地方輸入Annecy類型並點擊'查找位置'。

Answer 1

try the following: 
$(document).ready(function (e) { 
    $('#loading').hide().ajaxStart(function() { 
     $(this).show(); 
    }) 
    .ajaxStop(function (e) { 
     $(this).hide(); 
     }); 
    });