刚开始学mui时，页面跳转传值无疑是很多初学者遇到的难题。这里分享一个我自己调试好了的两个页面间操作：
场景是index.html页面跳转至a.html页面并且传值（包括预加载参数跟fire()带的参数）。注意，这里用到的方法是很多方法中的一种，有需要改进的地方，请多多指教。我也是初学O(∩_∩)O。
【index.htm页面代码如下】：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet" />
<script type="text/javascript" charset="utf-8">
mui.init();
</script>
</head>
<body>
<div class="mui-content">
<button type="button" id="bbtn" class="mui-btn mui-btn-blue">a.html</button>
<div id="sss">....</div>
</div>
</body>
<script>
var apage = null;
mui.plusReady(function() {
mui.preload({
url: "a.html",
id: "a.html", //默认使用当前页面的url作为id
styles: {}, //窗口参数
extras: {
idd: "mui.preload预加载页面了"
} //自定义扩展参数
});
document.getElementById("bbtn").addEventListener('tap', function() {
if(apage == null) {
apage = plus.webview.getWebviewById("a.html");
}
mui.fire(apage, 'hahah', {
idd: "ID是我"
});
apage.show();
})
});
</script>
<script>
document.addEventListener('backIndexPage', function(ee) {
document.getElementById("sss").innerText = ee.detail.str;
})
</script>
</html>
【a.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" />
<script src="js/mui.min.js"></script>
<script type="text/javascript">
mui.init();
</script>
</head>
<body>
<div class="mui-content">
<button type="button" id="anniu">返回</button>
<div id="ggg">....</div>
<div id="ggg1">....</div>
</div>
</body>
<script>
document.addEventListener('hahah', function(e) {
var ppg = plus.webview.currentWebview();
//var ppg = plus.webview.getWebviewById('a.html');
document.getElementById("ggg").innerText = "fire事件参数:" + e.detail.idd;
document.getElementById("ggg1").innerText = "页面预加载参数:" + ppg.idd;
})
document.getElementById("anniu").addEventListener('tap',function(){
//var indexPage=plus.webview.getWebviewById('index.html');
var indexPage=plus.webview.getLaunchWebview();//获取首页对象
console.log(indexPage);
mui.fire(indexPage,'backIndexPage',{str:"我回来了！"});
mui.back();
})
</script>
</html>
海洋鳓
- 发布：2016-10-20 16:50
- 更新：2016-10-20 16:50
- 阅读：27882
mui页面间跳转并且传值以及fire()方法
分类：MUI
1 个评论
要回复文章请先登录或注册
乙亥