<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<!--标准mui.css-->
<link rel="stylesheet" href="./css/mui.min.css">
</head>
<body>
<!-- 侧滑导航根容器 -->
<div class="mui-off-canvas-wrap mui-draggable mui-slide-in">
<!-- 菜单容器 -->
<aside class="mui-off-canvas-left">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<!-- 菜单具体展示内容 -->
...
</div>
</div>
</aside>
<!-- 主页面容器 -->
<div class="mui-inner-wrap">
<!-- 主页面标题 -->
<header class="mui-bar mui-bar-nav">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
<a class="mui-icon mui-icon-bars mui-pull-right" id="cehua"></a>
<h1 class="mui-title">侧滑</h1>
</header>
<!-- 底部选项卡 -->
<nav class="mui-bar mui-bar-tab">
<a class="mui-tab-item mui-active">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">首页</span>
</a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-phone"></span>
<span class="mui-tab-label">电话</span>
</a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-email"></span>
<span class="mui-tab-label">邮件</span>
</a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-gear"></span>
<span class="mui-tab-label">设置</span>
</a>
</nav>
<div class="mui-content mui-scroll-wrapper">
<div class="mui-scroll">
<!-- 主界面具体展示内容 -->
<ul class="mui-table-view mui-grid-view mui-grid-9">
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="info">
<a href="info.html">
<span class="mui-icon mui-icon-info"></span>
<div class="mui-media-body">信息</div>
</a>
</li>
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
<span class="mui-icon mui-icon-email"><span class="mui-badge">5</span></span>
<div class="mui-media-body">Email</div></a>
</li>
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
<a href="make.html">
<span class="mui-icon mui-icon-starhalf"></span>
<div class="mui-media-body">名片</div>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<script src="js/mui.min.js">
mui('.mui-medi').on('tap','a',function(){
document.location.href=this.href;
});
</script>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js">
</script>
</body>
</html>
9 个回复
BoredApe - 有问题就会有答案。
上代码,或测试demo
GODVer (作者)
DCloud_UNI_FXY
监听tap事件,document.location.href=this.href;
GODVer (作者)
还是不可以,主要是点不到那个a标签
<li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3" id="info">
<a href="info.html">
<span class="mui-icon mui-icon-info"></span>
<div class="mui-media-body">信息</div>
</a>
</li>
GODVer (作者)
我用查看器可以点到,直接点web端点不到
DCloud_UNI_FXY
贴完整代码
GODVer (作者)
<!DOCTYPE html>
<html>
</html>
GODVer (作者)
点不到下面的a链接放在侧滑div里面
GODVer (作者)
直接用pc的浏览器倒是可以点到 放在移动端就点不到,app也是点不到