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（）不工作

回答

相关问题