注册 登录
帝普一世
帝普一世
  • 发布：2016-04-09 17:05
  • 更新：2016-04-11 15:58
  • 阅读：5885

APP中顶部菜单栏不显示

分类：MUI

mui制作的页面，
问题：
打包APP，安卓手机运行，顶部的导航菜单栏不显示。
由于没有越狱苹果机，故苹果APP没测试

手机浏览器打开正常
电脑浏览器打开正常

代码如下：

<!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.min.css" rel="stylesheet"/>  
    <link href="css/app.css" rel="stylesheet"/>  
    <link href="css/iconfont.css" rel="stylesheet"/>  

</head>  
<body>  
<header class="mui-bar mui-bar-nav">  
    <a class="mui-action-back mui-icon mui-icon-list mui-pull-right"></a>  
    <h1 class="mui-title">商城APP</h1>  
</header>  

<div class="mui-content">  
<!--产品搜索-->  
<div id="search">  
    <div class="mui-input-row">  
        <form name="searchform" method="post" action="/index.php">  
        <input type="hidden" name="show" value="title,huohao">  
        <input name="keyboard" type="text" class="mui-input-speech mui-input-clear" maxlength="8" placeholder="请输入关键词">  
        <label><input type="submit" name="submit" value="搜索" class="kbut"></label>  
        </form>  
    </div>  
</div>  
<!--公告-->  
<ul class="mui-table-view" id="gonggao">  
    <li class="mui-table-view-cell"><a href="#"><span class="mui-icon iconfont icon-gonggao"></span>本周特惠享不停，订餐即送农夫山泉1瓶。</a></li>  
</ul>  
<!--轮播图片-->  
<div id="slider" class="mui-slider">  
    <div class="mui-slider-group mui-slider-loop">  
        <div class="mui-slider-item mui-slider-item-duplicate">  
            <a href="#"><img src="http://dcloudio.github.io/mui/assets/img/yuantiao.jpg"></a>  
        </div>  
        <div class="mui-slider-item">  
            <a href="#"><img src="http://dcloudio.github.io/mui/assets/img/shuijiao.jpg"></a>  
        </div>  
        <div class="mui-slider-item">  
            <a href="#"><img src="http://dcloudio.github.io/mui/assets/img/muwu.jpg"></a>  
        </div>  
        <div class="mui-slider-item">  
            <a href="#"><img src="http://dcloudio.github.io/mui/assets/img/cbd.jpg"></a>  
        </div>  
        <div class="mui-slider-item">  
            <a href="#"><img src="http://dcloudio.github.io/mui/assets/img/yuantiao.jpg"></a>  
        </div>  
        <div class="mui-slider-item mui-slider-item-duplicate">  
            <a href="#"><img src="http://dcloudio.github.io/mui/assets/img/shuijiao.jpg"></a>  
        </div>  
    </div>  
    <div class="mui-slider-indicator">  
        <div class="mui-indicator mui-active"></div>  
        <div class="mui-indicator"></div>  
        <div class="mui-indicator"></div>  
        <div class="mui-indicator"></div>  
    </div>  
</div>  
<!--分类图标-->  
<ul class="mui-table-view mui-grid-view mui-grid-9" id="fenlei">  
    <li class="mui-table-view-cell mui-media mui-col-xs-3">  
        <a href="category.html">  
            <span class="mui-icon iconfont icon-fenlei1"></span>  
            <div class="mui-media-body">全部分类</div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media mui-col-xs-3">  
        <a href="#">  
            <span class="mui-icon iconfont icon-waimai"></span>  
            <div class="mui-media-body">外卖订餐</div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media mui-col-xs-3">  
        <a href="#">  
            <span class="mui-icon iconfont icon-jinkoushipin"></span>  
            <div class="mui-media-body">进口商品</div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media mui-col-xs-3">  
        <a href="#">  
            <span class="mui-icon iconfont icon-jiushuiyinliao"></span>  
            <div class="mui-media-body">酒水饮料</div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media mui-col-xs-3">  
        <a href="#">  
            <span class="mui-icon iconfont icon-xianluxuanxiangqiacuxiao"></span>  
            <div class="mui-media-body">本周促销</div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media mui-col-xs-3">  
        <a href="#">  
            <span class="mui-icon iconfont icon-dingdan"></span>  
            <div class="mui-media-body">我的订单</div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media mui-col-xs-3">  
        <a href="#">  
            <span class="mui-icon iconfont icon-wodeshoucang"></span>  
            <div class="mui-media-body">我的收藏</div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media mui-col-xs-3">  
        <a href="#">  
            <span class="mui-icon iconfont icon-youhuiquan"></span>  
            <div class="mui-media-body">优惠券</div>  
        </a>  
    </li>  
</ul>  

<div class="dtit">推荐外卖</div>  
<ul class="mui-table-view shoplb">  
    <li class="mui-table-view-cell mui-hidden">cared  
        <div id="M_Toggle" class="mui-switch mui-active">  
            <div class="mui-switch-handle"></div>  
        </div>  
    </li>  
    <li class="mui-table-view-cell mui-media">  
        <a href="#">  
            <img class="mui-media-object mui-pull-left" src="/images/201508/goods_img/2097_G_1439997384878.jpg">  
            <div class="mui-media-body">  
                康师傅卤香牛肉面桶装方便面  
                <div class="mui-price">  
                    <span class="pull-left"><strong><b class="dmui-colory">￥1.00元</b></strong> <small class="dmui-margin-lr"><del>￥1.00元</del></small></span>  
                </div>  
                <div class="mui-numbuy">  
                    <span class="mui-pull-left">销量：289</span>  
                    <div class="mui-numbox mui-pull-right" data-numbox-min="1">  
  <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>  
  <input class="mui-numbox-input" type="number" />  
  <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>  
</div>  
                </div>  
            </div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media">  
        <a href="#">  
            <img class="mui-media-object mui-pull-left" src="/images/201508/goods_img/2093_G_1439997266202.jpg">  
            <div class="mui-media-body">  
                康师傅红烧牛肉珍品袋方便面  
                <div class="mui-price">  
                    <span class="pull-left"><strong><b class="dmui-colory">￥1.00元</b></strong> <small class="dmui-margin-lr"><del>￥1.00元</del></small></span>  
                </div>  
                <div class="mui-numbuy">  
                    <span class="mui-pull-left">销量：289</span>  
                    <div class="mui-numbox mui-pull-right" data-numbox-min="1">  
  <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>  
  <input class="mui-numbox-input" type="number" />  
  <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>  
</div>  
                </div>  
            </div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media">  
        <a href="#">  
            <img class="mui-media-object mui-pull-left" src="/images/201508/goods_img/1903_G_1439989499915.jpg">  
            <div class="mui-media-body">  
                45g好丽友好有趣（大凹凸蜂蜜）  
                <div class="mui-price">  
                    <span class="pull-left"><strong><b class="dmui-colory">￥1.00元</b></strong> <small class="dmui-margin-lr"><del>￥1.00元</del></small></span>  
                </div>  
                <div class="mui-numbuy">  
                    <span class="mui-pull-left">销量：289</span>  
                    <div class="mui-numbox mui-pull-right" data-numbox-min="1">  
  <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>  
  <input class="mui-numbox-input" type="number" />  
  <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>  
</div>  
                </div>  
            </div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media">  
        <a href="#">  
            <img class="mui-media-object mui-pull-left" src="http://dcloudio.github.io/mui/assets/img/yuantiao.jpg">  
            <div class="mui-media-body">  
                旺仔牛奶糖18G  
                <div class="mui-price">  
                    <span class="pull-left"><strong><b class="dmui-colory">￥1.00元</b></strong> <small class="dmui-margin-lr"><del>￥1.00元</del></small></span>  
                </div>  
                <div class="mui-numbuy">  
                    <span class="mui-pull-left">销量：289</span>  
                    <div class="mui-numbox mui-pull-right" data-numbox-min="1">  
  <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>  
  <input class="mui-numbox-input" type="number" />  
  <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>  
</div>  
                </div>  
            </div>  
        </a>  
    </li>  
</ul>  
<div class="dtit">推荐饮料</div>  
<ul class="mui-table-view shoplb">  
    <li class="mui-table-view-cell mui-hidden">cared  
        <div id="M_Toggle" class="mui-switch mui-active">  
            <div class="mui-switch-handle"></div>  
        </div>  
    </li>  
    <li class="mui-table-view-cell mui-media">  
        <a href="#">  
            <img class="mui-media-object mui-pull-left" src="http://dcloudio.github.io/mui/assets/img/shuijiao.jpg">  
            <div class="mui-media-body">  
                幸福  
                <div class="mui-price">  
                    <span class="pull-left"><strong><b class="dmui-colory">￥1.00元</b></strong> <small class="dmui-margin-lr"><del>￥1.00元</del></small></span>  
                </div>  
                <div class="mui-numbuy">  
                    <span class="mui-pull-left">销量：289</span>  
                    <div class="mui-numbox mui-pull-right" data-numbox-min="1">  
  <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>  
  <input class="mui-numbox-input" type="number" />  
  <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>  
</div>  
                </div>  
            </div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media">  
        <a href="#">  
            <img class="mui-media-object mui-pull-left" src="http://dcloudio.github.io/mui/assets/img/muwu.jpg">  
            <div class="mui-media-body">  
                木屋  
                <div class="mui-price">  
                    <span class="pull-left"><strong><b class="dmui-colory">￥1.00元</b></strong> <small class="dmui-margin-lr"><del>￥1.00元</del></small></span>  
                </div>  
                <div class="mui-numbuy">  
                    <span class="mui-pull-left">销量：289</span>  
                    <div class="mui-numbox mui-pull-right" data-numbox-min="1">  
  <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>  
  <input class="mui-numbox-input" type="number" />  
  <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>  
</div>  
                </div>  
            </div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media">  
        <a href="#">  
            <img class="mui-media-object mui-pull-left" src="http://dcloudio.github.io/mui/assets/img/cbd.jpg">  
            <div class="mui-media-body">  
                CBD  
                <div class="mui-price">  
                    <span class="pull-left"><strong><b class="dmui-colory">￥1.00元</b></strong> <small class="dmui-margin-lr"><del>￥1.00元</del></small></span>  
                </div>  
                <div class="mui-numbuy">  
                    <span class="mui-pull-left">销量：289</span>  
                    <div class="mui-numbox mui-pull-right" data-numbox-min="1">  
  <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>  
  <input class="mui-numbox-input" type="number" />  
  <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>  
</div>  
                </div>  
            </div>  
        </a>  
    </li>  
    <li class="mui-table-view-cell mui-media">  
        <a href="#">  
            <img class="mui-media-object mui-pull-left" src="http://dcloudio.github.io/mui/assets/img/yuantiao.jpg">  
            <div class="mui-media-body">  
                远眺  
                <div class="mui-price">  
                    <span class="pull-left"><strong><b class="dmui-colory">￥1.00元</b></strong> <small class="dmui-margin-lr"><del>￥1.00元</del></small></span>  
                </div>  
                <div class="mui-numbuy">  
                    <span class="mui-pull-left">销量：289</span>  
                    <div class="mui-numbox mui-pull-right" data-numbox-min="1">  
  <button class="mui-btn mui-numbox-btn-minus" type="button">-</button>  
  <input class="mui-numbox-input" type="number" />  
  <button class="mui-btn mui-numbox-btn-plus" type="button">+</button>  
</div>  
                </div>  
            </div>  
        </a>  
    </li>  
</ul>  
</div>  
<!--底部导航-->  
<nav class="mui-bar mui-bar-tab">  
  <a class="mui-tab-item mui-active" href="#tabbar">  
        <span class="mui-icon mui-icon-home"></span>  
        <span class="mui-tab-label">超市</span>  
    </a>  
    <a class="mui-tab-item" href="#tabbar-with-chat">  
        <span class="mui-icon iconfont icon-meishi"></span>  
        <span class="mui-tab-label">美食</span>  
    </a>  
    <a class="mui-tab-item" href="#tabbar-with-sms">  
        <span class="mui-icon iconfont icon-tuangou"></span>  
        <span class="mui-tab-label">团购</span>  
    </a>  
    <a class="mui-tab-item" href="#tabbar-with-map">  
        <span class="mui-icon iconfont icon-gouwuche"></span>  
        <span class="mui-tab-label">购物车</span>  
    </a>  
    <a class="mui-tab-item" href="user.html">  
        <span class="mui-icon iconfont icon-wode"></span>  
        <span class="mui-tab-label">我的</span>  
    </a>  
</nav>  
<script src="js/mui.min.js"></script>  
<script type="text/javascript" charset="UTF-8">  
    mui.init();  
    //获得slider插件对象  
    var gallery = mui('.mui-slider');  
    gallery.slider({  
        interval: 5000 //自动轮播周期，若为0则不自动播放，默认为0；  
    });  
    mui('body').on('tap', 'a', function() {  
                var id = this.getAttribute("href");  
                var href = this.href;  
                    var webview_style = {  
                        popGesture: "close"  
                    };  
                    mui.openWindow({  
                        id: id,  
                        url: href,  
                    });  
            });  
</script>  
</body>  
</html>
2016-04-09 17:05 负责人:无 分享

没有找到相关结果

    已邀请:
    帝普一世

    帝普一世 (作者) - 码农周

    原来是HBuider创建APP模板时，那个app.css里自动写了隐藏顶部的CSS，
    汗，谁能想到这玩意。

    2016-04-11 15:58 分享

    • yungehaha

      怎么解决的啊

      2016-05-10 13:52

    评论 取消
    lxy_iOS

    lxy_iOS

    这个容易解决 可以叫安卓或者iOS工程师进行稍做修改 状态栏就可以出现了 我就是这样修改的 成功了

    2016-04-09 17:13 分享

    • 帝普一世 (作者)

      明显不是这样的，以前打包好多APP了，这次为啥会出现这样的情况。

      2016-04-09 17:24

    • lxy_iOS

      回复 帝普一世:可能打包方式不一样 之前我是直接打包服务器地址 现在是直接打包本地App 之后对比服务器版本把最新的app下载下来 这种方式 状态栏和导航栏加起来才44

      2016-04-12 09:57

    评论 取消
    为什么被折叠? 0 个回复被折叠

    该问题目前已经被锁定, 无法添加新回复

    退出全屏模式 全屏模式 回复
    友情链接
    优势智云 黑马程序员 程序员客栈 个推 锐亚教育 即速应用 DCloud新闻 InfoQ 蓝莺IM HeapDump性能社区 diygw可视化 申请友链

    DCloud 即数字天堂(北京)网络技术有限公司是W3C成员及HTML5中国产业联盟发起单位

    京ICP备12046007号-4 | 京公网安备：11010802035340号 | 国家信息安全等级保护三级，证书编号：11010813802-20001

    | | 违法违规信息举报