看来jQuery mobile正在启动页面上添加加载消息。我真的不知道发生了什么,但是请考虑以下简单代码段:
<!DOCTYPE html>
<html>
<head>
<title>sadFace</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<meta charset="utf-8" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
</head>
<body>
<h1>;__;</h1>
</body>
</html>
我什至必须向下滚动才能看到加载消息。所以我认为可能会发生,因为我没有遵循典型的jQuery移动页面解剖结构,而是:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="header">
<h1>;_;</h1>
</div><!-- /header -->
<div data-role="content">
<p>Same shit, different page.</p>
</div><!-- /content -->
<div data-role="footer">
<h4><a href="http://www.google.com/pacman/">need cookies :C</a></h4>
</div><!-- /footer -->
</div><!-- /page -->
</body>
</html>
相同。我完全被这种行为所震惊。即使我从上周开始我的项目,我也用相同的结果测试jQuery1.0rc2,看起来还不错。到底发生了什么<。<
在 jQuery Mobile' js中查找,我认为此
initializePage: function()
负责该消息。我可以注释掉
//cue page loading message
$.mobile.showPageLoadingMsg();
或设置
autoInitializePage: false
,但我宁愿选择不涉及经过修改的jQuery文件的解决方案(除非是错误)。
请您参考如下方法:
您也必须添加CSS,这样就可以了:
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
详细信息:
它始终将以下HTML放在您的 body 底部:
<div class='ui-loader ui-body-a ui-corner-all'><span class='ui-icon ui-icon-loading spin'></span><h1></h1></div>
这是相关的CSS(因此,如果需要,也许您可以自己使用它)
.ui-loading .ui-loader { display: block; }
.ui-loader { display: none; position: absolute; opacity: .85; z-index: 100; left: 50%; width: 200px; margin-left: -130px; margin-top: -35px; padding: 10px 30px; }
函数
showPageLoadingMsg
将CSS类'.ui loading'添加到HTML标记中,然后可见