Framewok7后退监听器不在多个选项卡上工作

时间:2018-06-05 08:14:04

标签: javascript android cordova html-framework-7

我试图阻止我的cordova android应用程序在我的手机(android)上按下物理后退按钮时不关闭,相反,我想打开一个对话框按两次按钮然后关闭应用程序,但我无法弄清楚如何正确地调用或收听后退按钮。

以下是使用framework7

的标签
<div class="toolbar tabbar-labels toolbar-bottom-md">
        <div class="toolbar-inner">
          <a href="#view-home" class="tab-link tab-link-active">
            <i class="icon f7-icons ios-only">home</i>
            <i class="icon f7-icons ios-only icon-ios-fill">home_fill</i>
            <i class="icon material-icons md-only">home</i>
            <span class="tabbar-label">Home</span>
          </a>
          <a href="#view-catalog" class="tab-link">
            <i class="icon f7-icons ios-only">list</i>
            <i class="icon f7-icons ios-only icon-ios-fill">list_fill</i>
            <i class="icon material-icons md-only">view_list</i>
            <span class="tabbar-label">catalog</span>
          </a>
          <a href="#view-settings" class="tab-link">
            <i class="icon f7-icons ios-only">settings</i>
            <i class="icon f7-icons ios-only icon-ios-fill">settings_fill</i>
            <i class="icon material-icons md-only">settings</i>
            <span class="tabbar-label">Settings</span>
          </a>
        </div>
      </div>

Framework7初始化说明我已经声明了pushState

 var app  = new Framework7({
      root: '#app',  
      id: 'io.HomeApplication.Homeapp',  
      name: 'My Application',  
      theme: 'auto',  
      pushState :true,   

 //other methods,data here

初始化视图

// Init/Create views
var homeView = app.views.create('#view-home', {
  url: '/',
  on: {
    pageInit: function (e, page) {
      // do something when page initialized
      document.addEventListener("backbutton", onBackKeyDown, false);
    } 
  }
});

 var catalogView = app.views.create('#view-catalog', {
    url: '/devices/'
  });

var settingsView = app.views.create('#view-settings', {
  url: '/settings/'
});

首先,我将onBackKeyDown称为函数。

function onBackKeyDown(){

}

但现在我把它放在我的app方法上。

// App root methods
  methods: {

    onBackKeyDown: function(){

      app.dialog.alert('this was called');

    },

但是,当我在手机上按下按钮时,它没有执行任何建议会很棒。

1 个答案:

答案 0 :(得分:0)

您的onBackKeyDown侦听器位于view-home视图中。 从中获取并将其置于代码的其余部分:

 var app  = new Framework7({.....});
 document.addEventListener("backbutton", onBackKeyDown, false);

它应该成为所有应用程序的监听者。