打开子页面的方式是openWindow
mui.openWindow({
url : 'page/perfect_information/welcome.html',
id : 'welcome.html'
});
首页代码：
<!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>
<link href="css/mui.css" rel="stylesheet"/> </head>
<body>
<header class="mui-bar mui-bar-nav hBg">
<!--<div id="logo">
<img src="image/logo.png" />
</div>-->
<h1 class="mui-title">标题</h1>
</header>
<nav class="mui-bar mui-bar-tab hBg" id="tabBar">
<a class="mui-tab-item mui-active" id="home">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">首页</span>
</a>
<a class="mui-tab-item" id="my_record">
<span class="mui-icon mui-icon-compose"></span>
<span class="mui-tab-label">我的记录</span>
</a>
<a class="mui-tab-item" id="data_analysis">
<span class="mui-icon mui-icon-bars"></span>
<span class="mui-tab-label">数据分析</span>
</a>
<a class="mui-tab-item" id="my">
<span class="mui-icon mui-icon-person"></span>
<span class="mui-tab-label">我的信息</span>
</a>
</nav>
<script src="js/mui.min.js"></script>
<script src="js/h.js"></script>
<script type="text/javascript" charset="utf-8">
mui.init({
subpages : [
{
url : 'home.html',
id : 'home.html',
styles : {
top : '44px',
bottom : '44px',
width : "100%"
}
},
{
url : 'my_record.html',
id : 'my_record.html',
styles : {
left : '100%',
top : '44px',
bottom : '44px',
width : "100%"
}
},
{
url : 'data_analysis.html',
id : 'data_analysis.html',
styles : {
left : '200%',
top : '44px',
bottom : '44px',
width : "100%"
}
},
{
url : 'my.html',
id : 'my.html',
styles : {
left : '300%',
top : '44px',
bottom : '44px',
width : "100%"
}
}
]
});
mui.plusReady(function(){
h('#home').tap(function(){changSub(1);});
h('#my_record').tap(function(){changSub(2);});
h('#data_analysis').tap(function(){changSub(3);});
h('#my').tap(function(){changSub(4);});
});
function changSub(index){
var sub1 = plus.webview.getWebviewById('home.html');
var sub2 = plus.webview.getWebviewById('my_record.html');
var sub3 = plus.webview.getWebviewById('data_analysis.html');
var sub4 = plus.webview.getWebviewById('my.html');
sub1.setStyle({left: (index - 1) * 100 + "%"});
sub2.setStyle({left: (2 - index) * 100 + "%"});
sub3.setStyle({left: (3 - index) * 100 + "%"});
sub4.setStyle({left: (4 - index) * 100 + "%"});
}
</script> </body>
</html>
2 个回复
m***@bocosoft.com.cn (作者)
我自己解决了 有同样问题的初学朋友可以学习下 如有问题，请大家指导
h('#btn').tap(function(){
var index=plus.webview.getLaunchWebview();//获得初始窗口
plus.webview.show(index);//打开初始窗口
index.evalJS("changSub(1); //改变选项卡点击位置
h('#tabBar').find('a').removeClass('mui-active');
h('#home').addClass('mui-active');");
});
soueo
赞一个