排名
6
文章
6
粉丝
16
评论
8
{{item.articleTitle}}
{{item.blogName}} : {{item.content}}
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2025TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:
50010702506256
50010702506256
欢迎加群交流技术
分类:
前端移动端
纠结了两天的MUI跳转的问题,终于解决了 ,现在分享给大家,希望大家有什么坑的解决也给我分享分享 哈哈,废话不多说,上代码说话:
跳转:
MUI-不建议使用a标签的href属性跳转,会出现屏蔽失效现象,在MUI跳转使用mui.openWindow({});方式跳转
首先在主页面,这是我自己写的跳转,直接给你们看了
//点击列表跳转详情,这里是一个简答的点击事件而已
mui(".mui-table-view").on("tap","li",function(){
//找到id和用户名,这里是通过选择器去找到自己存的相应的
var blogid=$(this).find(".blogid").val();
var userName=$(this).find(".userName").val();
mui.openWindow({
url: "article_dedetails.html",
id: "article_dedetails",
extras: {
//自定义扩展参数,可以用来处理页面间传值
blogid:blogid,
userName:userName
},
show: {
autoShow: true, //页面loaded事件发生后自动显示,默认为true
aniShow: "slide-in-right", //页面显示动画,默认为”slide-in-right“;
duration: "200" //页面动画持续时间,Android平台默认100毫秒,iOS平台默认200毫秒;
},
waiting: {
autoShow: true, //自动显示等待框,默认为true
title: '正在加载...', //等待对话框上显示的提示内容
options: {
width: "100", //等待框背景区域宽度,默认根据内容自动计算合适宽度
height: "100", //等待框背景区域高度,默认根据内容自动计算合适高度
}
}
})
});然后你再目的页面跳转回到主页面的时候也不能用a标签的的href方式跳转 要不然也会到时主页面的跳转会失效 你可以用同样的方式mui.openWindow跳转回来,
或者使用mui里的<图标跳转返回就可以了
<header class="mui-bar mui-bar-nav"> <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>//返回的图标 <h1 class="mui-title">文章详情</h1> </header>
以上就能跳转成功啦,如果你用a的href跳转,只能第一次加载能跳转 之后的就失效没用了。
二、页面之间的传值
在跳转目的的页面
mui.plusReady(function() {
var self = plus.webview.currentWebview();
//拿到name和id
alert("ID值:"+self.blogid+",用户名:"+self.userName);
});你要从主页面跳转进来,要不然你的值从哪里来 对不对,一定要记得写在mui.plusReady里面才有效,并且你这个在电脑测试没有效果 ,要在真机调试会看到效果。
好了下期见
评价