[英]Jquery-Mobile: $.mobile.showPageLoadingMsg() is not working
我是新的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>
謝謝
我沒有嘗試過,但似乎你應該阻止錨點/按鈕的默認動作(即自動跳轉到#BMR_Result)。
<a href="#BMR_Result" onclick="BMR_Cal(); return false;" data-role="button">submit</a>
這可能是因為你在同一個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;
}
當然,您必須將.ajax調用替換為您自己的代碼。
需要在mobileinit事件處理程序中定義$ .mobile.loadingMessage =“please wait ...”設置。 在加載jQuery之后,但在加載jQueryMobile之前,該處理程序需要完全綁定。
它仍然很奇怪它不適合你,因為你仍然應該得到默認頁面加載文本,即'loading'。 你有沒有在其他地方將$ .mobile.loadingMessage設置為false?
無論如何,我正在按書完成所有事情,但我仍然無法通過這種方法來做我想做的事情。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.