添加JQTouch加載圖像onClick

Question

我想知道是否有一種方法來將load.gif圖像添加到所有通過鏈接的頁面。 。我一直在閱讀StackOverFlow幾個小時，但我還沒有找到任何可行的方法。我想用這個來顯示一個加載圖像，並禁用按鈕，直到頁面加載完畢，然後顯示頁面。

因此，在文檔打開時顯示加載圖像，然後在文檔加載後刪除加載圖像。

我會粘貼一些代碼，但所有我試過的代碼都不起作用。有人能帶領我朝着正確的方向發展嗎？如果有簡單的代碼片段，我會非常感激。

Answer 1

這適用於使用Zepto的jQTouch（尚未使用jQuery進行測試）。

HTML：

<div id="jqt"> 
    ... 
    <div id="loading"></div> 
</div> 

CSS：

div#jqt #loading { 
    background: rgba(0,0,0,0.5) url('../images/scanner/loading.gif') 50% 50% no-repeat; 
    z-index: 999; 
    position: fixed; 
} 

JS：

$(document).on('ajaxStart', function(){ 
    $('#loading').addClass('current'); 
}); 

$(document).on('ajaxStop', function(){ 
    $('#loading').removeClass('current'); 
});