loaded_no_auto_show_home.html(主页)
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
</head>
<body>
<button type="button" id="btn_open" class="mui-btn mui-btn-green">打开子页</button>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init();
/*从A页面打开B页面,B页面为一个需要从服务端加载的列表页面,
若在B页面loaded事件发生时就将其显示出来,
因服务器数据尚未加载完毕,列表页面为空,用户体验不好;
可通过如下方式改善用户体验(最好的用户体验应该是通过预加载的方式):
第一步,B页面loaded事件发生后,不自动显示;*
*/
document.getElementById("btn_open").addEventListener('tap', function() {
//A页面中打开B页面,设置show的autoShow为false,则B页面在其loaded事件发生后,不会自动显示;
mui.openWindow({
url: 'loaded_no_auto_show_sub.html',
id: 'loaded_no_auto_show_sub',
show: {
autoShow: false
}
});
})
</script>
</body>
</html>
loaded_no_auto_show_sub.html(新页)
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
</head>
<body>
<div id="div1">我是div1</div>
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init();
//第二步,在B页面获取列表数据后,再关闭等待框、显示B页面
//B页面onload从服务器获取列表数据;
window.onload = function() {
var url = 'http://zyz1.top/handler/GetCurrentUser.ashx';
//从服务器获取数据
//业务数据获取完毕,并已插入当前页面DOM;
//注意:若为ajax请求,则需将如下代码放在处理完ajax响应数据之后;
mui.get(url, {
"cid": '1'
}, function(data) {
mui.plusReady(function() {
document.getElementById("div1").innerText = '你好,' + data.rname;
plus.nativeUI.closeWaiting(); //关闭等待框
mui.currentWebview.show(); //显示当前页面
});
});
}
</script>
</body>
</html>
原文链接:
https://www.cnblogs.com/beast-king/p/9115568.html