Jquery手機：$ .mobile.showPageLoadingMsg（）不工作

我是新的jQuery手機。我想使用jQuery Mobile的showPageLoadingMsg（），但它不工作。以下是我的代碼請任何人可以幫助我。

code 

< !DOCTYPE html> 
< html> 
< head> 
    < meta charset="utf-8"> 
    < meta name="viewport" content="width=device-width, initial-scale=1"> 
    < title>Single page template</title> 
    < link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" /> 
    < script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script> 
    < script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script> 
< /head> 
< body> 
< !-- BMR Screen page --> 

    < div data-role="page" id="BMR_screen"> 

    < div data-role="header" data-theme="e" id="hdrBMRScreen"> 

    < h1> BMR Screen< /h1> 
    < /div> 

    < div data-role="content" id="contentBMRScreen"> 

     < div data-role="fieldcontain"> 

      < label for="BMR_age">Age(in years):</label> 

      < input type="text" id="BMR_age" /> 

     < /div> 

     < a href="#BMR_Result" onclick="BMR_Cal()" data-role="button">submit</a> 

    < /div> 

< /div> 

< !-- End BMR Screen --> 

    < div data-role="page" id="BMR_Result"> 

     < div data-role="header" data-theme="b" > 

      < a data-role="button" data-rel="back" data-icon="back">back</a> 

      <h1>BMR Result</h1> 

     < /div> 

     < div data-role="content">  

      < p id="W_Range">Weight Range:</p> 

     < /div> 
    < /div> 

    < script type="text/javascript"> 

    var agevar; 


    $(document).ready(function() { 
    // Initialize variables 
    ageVar = $('#BMR_age');  
    }); 

    function BMR_Cal() 

{  
    $.mobile.loadingMessage = "please wait...";  
    $.mobile.showPageLoadingMsg(); 

    if(ageVar.val() > 0) 
    {  
     some code is there 
     ............. 

     $.mobile.changePage($("#BMR_Result"), { transition: "flip"});  
    } 

    $.mobile.hidePageLoadingMsg(); 

    } 
    < /script> 
    < /body> 
< /html>

感謝

來源

2011-12-13 naresh

這可能是因爲你調用兩個相同的JS方法裏面，這樣瀏覽器就沒有時間去更新它的UI ......

更新：似乎有一些需要更多的變化。這是你的功能，我的工作簡化版本：

function BMR_Cal(){ 
    $.mobile.loadingMessage = "please wait..."; 
    var ageVar = $('#BMR_age'); 

    if (ageVar.val() > 0) { 
     $.mobile.showPageLoadingMsg(); 
     $.ajax({ 
      url:"http://wwww.google.com", 
      complete: function(){ 
       $.mobile.changePage($("#BMR_Result"), {transition: "flip"}); 
      } 
     }); 
    } 
    return false; 
}

當然，你將不得不更換阿賈克斯調用自己的代碼。

這裏的full working jsFiddle sample

來源

2011-12-13 11:11:58 Leon

對不起，它不工作。 – naresh

嘗試setTimeout，因爲UPDATE在我的回答 – Leon

仍然沒有working.here我使用$（document）.ready函數。這有什麼問題嗎？因爲我在一些使用$（document）.bind（「mobileinit」，function（）{//覆蓋這裏覆蓋這裏 }）的地方看到了。 – naresh

我沒有嘗試，但它好像你應該防止錨/按鈕的默認操作（即自動跳轉到#BMR_Result）。

<a href="#BMR_Result" onclick="BMR_Cal(); return false;" data-role="button">submit</a>

來源

2011-12-13 10:39:32 devnull69

我必須使用showPageLoadingMsg（）和hidePageLoadingMsg（）來顯示/隱藏加載消息。它不工作 – naresh

的$ .mobile.loadingMessage =「請稍候...」設置需要在mobileinit事件處理程序進行定義。該處理程序需要在加載jQuery之後，但在加載jQueryMobile之前完全綁定。

雖然它仍然不適合你，但仍然很奇怪，因爲你仍然應該得到默認的頁面加載文本，即'加載'。你有沒有把$ .mobile.loadingMessage設置爲false？

在任何情況下，我都會按照本書做所有事情，但我仍然無法按照自己的意願去做這個方法。

來源

2012-05-08 08:32:34 Wytze

Jquery手機：$ .mobile.showPageLoadingMsg（）不工作

回答

相關問題