jquery mobile 的loading提示“正在加載...”在不同版本中的不同實現方式

在jquery mobile開發中,在頁面的切換、或者ajax獲取數據時由於網速慢等其他原因，會有一個加載的時間，如果能在這段時間給一個“正在加載。。。”的提示，用戶體驗會更好。下面來簡單的介紹一下在jquery mobile中 “正在加載。。”提示怎么做。

首先准備工作：要在頁面中引入jquery mobile的css 、js、 jquery 文件。

然后：拿兩個按鈕做個測試：

<input type="button" value="顯示" onclick="showLoader()" />
 <input type="button" value="隱藏" onclick="hideLoader()" />

js部分：

 <script type="text/javascript">
            //顯示加載器
            function showLoader() {
                //顯示加載器.for jQuery Mobile 1.2.0
                $.mobile.loading('show', {
                    text: '加載中...', //加載器中顯示的文字
                    textVisible: true, //是否顯示文字
                    theme: 'a', //加載器主題樣式a-e
                    textonly: false, //是否只顯示文字
                    html: "" //要顯示的html內容，如圖片等
                });
            }

        //隱藏加載器.for jQuery Mobile 1.2.0
        function hideLoader() {
            //隱藏加載器
            $.mobile.loading('hide');
        }
        </script>

　　這樣就可以實現效果了

需要說明的是：我引用的的jquery mobile.js的版本是1.4的。在1.2及以下的版本中js是完全不同的。看下面的代碼：

<script>
    //顯示加載器
    function showLoader() {
        //顯示加載器.for jQuery Mobile 1.1.0
        $.mobile.loadingMessage = '加載中...';     //顯示的文字
        $.mobile.loadingMessageTextVisible = true; //是否顯示文字
        $.mobile.loadingMessageTheme = 'a';        //加載器主題樣式a-e
        $.mobile.showPageLoadingMsg();             //顯示加載器
    }

    //隱藏加載器.for jQuery Mobile 1.1.0
    function hideLoader() {
        //隱藏加載器	
        $.mobile.hidePageLoadingMsg();
    }
</script>