在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>
更多专业前端知识，请上 【猿2048】www.mk2048.com