如何在MUI中跳转外链？
什么是MUI？
MUI是一款基于HTML5和CSS3的移动端前端框架。因其轻量、灵活、易用而受到了广泛的欢迎。
为什么需要在MUI中跳转外链？
在移动端应用中，常常需要引导用户到指定网页进行查看或操作，因此需要跳转外链。
MUI中跳转外链的用法
MUI中跳转外链的方法比较简单，可以使用mui.openWindow()方法实现。
具体用法：
mui.init()
mui('.mui-scroll-wrapper').scroll({
indicators: false //是否显示滚动条
});
mui('.mui-action-back').on('tap', 'a', function() {
window.top.location.href = this.href; //本地window.top对象跳转
});
mui('.mui-scroll').on('tap', 'a', function() {
var href = this.getAttribute('href');
if(href.indexOf('http://') !== 0 && href.indexOf('https://') !== 0 ) {
//非http和https开头的，调用mui.openWindow打开本地页面
mui.openWindow({
url:href,
id:href,
styles:{
top:'0',
bottom:'50px',
},
extras:{}
});
} else {
//location.href = href; //跳转到外部网页
\tmui.openWindow({
\t\turl:href,
id:href,
styles:{
top:'0',//position状态栏
bottom:'0',//底部留空5040
},
show:{
autoShow:true,//页面loaded之后立即显示
aniShow:'slide-in-right',//页面显示动画
duration:150//页面动画持续时间
},
waiting:{
autoShow:true,//自动显示等待框
title:'正在加载...',//等待对话框上显示的提示内容
options:{
background:'#ffffff',//等待对话框背景色
width:'100px',//等待对话框宽度
height:'100px',
},
}
\t});
}
});
小结
通过mui.openWindow()方法可以实现跳转外链，在MUI框架中使得跳转操作非常轻松易用。希望本文的介绍对您有所帮助。
