关于mui.back重写后，调用无效的问题

这两天用HBuilder编辑器和mui框架编写H5移动端app的时候，遇到了一个监听手机返回按键（物理按键）并且重写后无效的问题，想和大家分享一下。

先看一下我的文件目录

文件夹myjs（存放个人js文件)

            文件 1、 login.js

                   2、 index.js

文件夹myhtml( 存放个人html文件)

        文件 1、login.html

                2、index.html

好了接下来让我们进入正题

出现的问题：app打开的时候先先进入login页面，然后由login跳转到index页面，在login页面没跳转到index页面之前，如果我们点击手机物理返回按键，我们需要先提示一下用户，再点击一次退出应用，在login.js页面使用mui.back=function(){'修改逻辑'}，编码大概是这样的：

mui.back=function(){                                                                                                          login.js
	console.log("监听到物理返回按键了login");
	if(tapnum==1){
		tapnum=0;
		plus.runtime.quit();
	}else{
		tapnum++;
		mui.toast('再点一次退出应用',{ duration:1000, type:'div' });
   	    setTimeout(function() {
	      tapnum = 0;
		}, 2000);
	}
}复制代码

这样是可以正常执行的，但是当我们从login跳转到index页面后，在按物理返回按键会直接退出应用程序，但是我需要在这个页面也和login页面一样，有个提示功能，于是我在index.js文件中有把mui.back从写了一下，和上面的一样，但是当我测试的时候，在index.js文件中却怎么也调用不了重写后的mui.back函数功能，实在感到奇怪，（HBuilder经常更新版本，每次更新后，从新打包以前编写的代码，在运行的时候经常会出现新的bug,我在没跟新之前，上面的问题是不存在的，两个页面都能监听到各自的返回事件，更新后就出先这个问题了），经过多次测试得到了如下解决方法：

mui.plusReady(function(){                                                                                                       index.js
	console.log('index关闭login');
	plus.webview.close('login');
    plus.key.addEventListener('backbutton', function() {
	    console.log("监听到物理返回按键了plusResdy");
		if(tapnum==1){
			tapnum=0;
			plus.runtime.quit();
		}else{
			tapnum++;
			mui.toast('再点一次退出应用',{ duration:1000, type:'div' });
	   	setTimeout(function() {
		    tapnum = 0;
			}, 2000);
		}
    }, false);
	console.log('关闭');
});复制代码

这样监听就能按照需求运行了

转载于:https://juejin.im/post/5b0b8f99f265da090b1f1a9a