夜帝
夜帝
  • 发布:2014-10-21 16:14
  • 更新:2015-01-08 11:45
  • 阅读:6391

tab bar(选项卡)webview模式打开后无法退出程序

分类:MUI
mui

mui实例程序中,tab bar(选项卡)webview模式,反复切换选项卡后,再点返回按钮(backbutton)返回到列表页后,本来再连续点击两次返回键就应该退出应用的,但是现在没有反应了,连“mui.toast('再按一次退出应用');”这个提示也没有出来

2014-10-21 16:14 负责人:无 分享
已邀请:
tzheng517

tzheng517

在选项卡的子页面统一加上:

                        mui.init({  
                swipeBack: false,  
                keyEventBind: {  
                    backbutton: false  
                }  
            });
  • liuhui

    可以了,非常感谢

    2015-01-08 10:34

liuhui

liuhui

<!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">  

        <link rel="stylesheet" href="css/mui.min.css">  
        <script src="js/mui.min.js"></script>  
        <style>  
            html,  
            body {  
                background-color: #efeff4;  
            }  
        </style>  
    </head>  

    <body>  
        <header class="mui-bar mui-bar-nav">  
            <a class="mui-icon  mui-pull-right" style="color: #999;"></a>  
            <h1 class="mui-title" id="title">解放军医院</h1>  
        </header>  
        <nav class="mui-bar mui-bar-tab">  
            <a id="defaultTab" class="mui-tab-item mui-active" href="tab-index.html">  
                <span class="mui-icon mui-icon-home"></span>  
                <span class="mui-tab-label">首页</span>  
            </a>  
            <a class="mui-tab-item" href="tab-survey.html">  
                <span class="mui-icon mui-icon-star"></span>  
                <span class="mui-tab-label">医院概况</span>  
            </a>  
            <a class="mui-tab-item" href="tab-contact.html">  
                <span class="mui-icon mui-icon-map"></span>  
                <span class="mui-tab-label">联系我们</span>  
            </a>  
            <a class="mui-tab-item" href="tab-myorder.html">  
                <span class="mui-icon mui-icon-gear"></span>  
                <span class="mui-tab-label">我的预约</span>  
            </a>  
        </nav>  

        <script>  
            mui.init();  
            mui.back = function() {  
                var btn = ["确定", "取消"];  
                mui.confirm('确认关闭当前窗口?', 'Hello MUI', btn, function(e) {  
                    if (e.index == 0) {  
                        mui.currentWebview.close();  
                    }  
                });  
            }  

            var menu = null,  
                list = null,  
                mask = null;  
            var showMenu = false;  
            var subpages = ['tab-index.html', 'tab-survey.html', 'tab-contact.html', 'tab-myorder.html'];  
            var subpage_style = {  
                top: '46px',  
                bottom: '50px'  
            };  
            mui.plusReady(function() {  
                // 隐藏滚动条  
                plus.webview.currentWebview().setStyle({  
                    scrollIndicator: 'none'  
                });  

                //当前的webview对象,应该为一个只有头和尾的  
                var self = plus.webview.currentWebview();  
                for (var i = 0; i < 4; i++) {  
                    //创建多个子的页面webview对象  
                    var sub = plus.webview.create(subpages[i], subpages[i], subpage_style);  
                    if (i > 0) {  
                        sub.hide();  
                    }  
                    self.append(sub);  
                }  
            });  
             //当前激活选项  
            var activeTab = subpages[0];  
            var title = document.getElementById("title");  
             //选项卡点击事件  
            mui('.mui-bar-tab').on('tap', 'a', function(e) {  
                var targetTab = this.getAttribute('href');  
                if (targetTab == activeTab) { //点击的当前活动的不处理  
                    return;  
                } else {  
                    //更换标题  
                    var tname = this.querySelector('.mui-tab-label').innerHTML;  

                    if (tname == "首页") {  
                        tname = "解放军医院";  
                    }  
                    title.innerHTML = tname;  
                    //显示目标选项卡  
                    plus.webview.show(targetTab, "auto");  
                    //隐藏当前;  
                    plus.webview.hide(activeTab);  
                    //更改当前活跃的选项卡  
                    activeTab = targetTab;  
                }  
            });  
        </script>  
    </body>  

</html>

我也使用了webview的选项卡,重写mui.back不起作用
我的版本是HBuilder 5.0.0.201501040824

  • 的所发生的

    你这个webView选项卡是在哪学的 我找了MUI的文档也没有

    2016-03-15 16:10

DCloud_UNI_CHB

DCloud_UNI_CHB

这个已确认为plus runtime的问题,客户端团队正在修复。

  • 海洋

    这个BUG太紧急重要了,啥时候解决啊。。。

    2014-11-12 15:27

DCloud_UNI_CHB

DCloud_UNI_CHB

你升级HBuilder后真机调试,应该已经解决;或者直接打包,也可以测试。

DCloud_UNI_CHB

DCloud_UNI_CHB

@liuhui 检查一下你的mui版本(最新版本是mui v1.0.0);

感谢@tzheng517 的回复,之前版本确实需要在每个子页面添加屏蔽监听返回按键的代码,mui 1.0.0不再需要;

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