目前这样同时接管了手机返回按钮和 webview 左上角的返回按钮
var nw = null;
nw = openViewUrl(url, true);
// 监听“返回”按钮事件
plus.key.addEventListener("backbutton", function() {
console.log("返回键已被按下--------");
nw.canBack(function(e) {
console.log("是否可后退:" + e.canBack);
if (e.canBack) {
nw.back();
} else {
console.log("关闭");
nw.close();
// 无效
// plus.key.removeEventListener("backbutton");
removeEventTest();
}
});
});
// 取消监听“返回”按钮事件
function removeEventTest() {
console.log("取消监听“返回”按钮事件");
plus.key.removeEventListener("backbutton", onback);
}
//打开外部页面 返回窗口标识符
function openViewUrl(url, back) {
console.log("打开url窗口" + back);
var sw = plus.nativeUI.showWaiting();
var w = plus.webview.open(
url,
url,
{
errorPage: "404.html",
top: "0px",
bottom: "0px",
statusbar: {
// 顶部电量栏 背景颜色
background: window.backgroundColor
},
// backButtonAutoControl: "close",
backButtonAutoControl: back ? "none" : "close",
titleNView: {
backgroundColor: window.backgroundColor,
autoBackButton: true,
titleColor: "#FFFFFF"
},
progress: window.backgroundColor,
zindex: 1000
},
"auto",
200,
function() {
sw.close();
sw = null;
}
);
return w;
}
改造后
//打开外部页面 返回窗口标识符
function openViewUrl(url, back, btn) {
console.log("打开url窗口" + back);
var sw = plus.nativeUI.showWaiting();
var w = plus.webview.open(
url,
url,
{
errorPage: "404.html",
top: "0px",
bottom: "0px",
statusbar: {
// 顶部电量栏 背景颜色
background: window.backgroundColor
},
// backButtonAutoControl: "close",
backButtonAutoControl: back ? "none" : "close",
titleNView: {
backgroundColor: window.backgroundColor,
// 参数 btn 是true 就不显示返回按钮 而显示关闭按钮
autoBackButton: btn ? false : true,
titleColor: "#FFFFFF",
buttons: btn
? [
{
type: "close",
float: "left",
onclick: clickButton
}
]
: []
},
progress: window.backgroundColor,
zindex: 1000
},
"auto",
200,
function() {
sw.close();
sw = null;
}
);
function clickButton() {
w.close();
console.log("点击了关闭按钮");
removeEventTest();
}
// 取消监听“返回”按钮事件
function removeEventTest() {
plus.key.removeEventListener("backbutton", function() {
// 不打印 但是移除生效
console.log("成功取消js监听“返回”按钮事件");
});
}
return w;
// w.show("auto",200,);
// ;
}
这种写法在有些有实体返回按键手机又问题
有的页面无法后退,有的页面后退直接提示再按一次退出,
再次改造
var nw = null;
nw = openViewUrl(url, true);
window.pageNw = nw;
mui.init({
swipeBack: true, //启用右滑关闭功能
keyEventBind: {
backbutton: true //开启back按键监听(默认就是true)
},
beforeback: function() {
console.log("home beforeback" + window.pageNw);
// 判断手机回收的页面是否存在
if (window.pageNw) {
var nw = window.pageNw;
nw.canBack(function(e) {
console.log("是否可返回:" + e.canBack + JSON.stringify(e));
if (e.canBack) {
nw.back();
} else {
console.log("关闭");
nw.close();
window.pageNw = null;
}
});
return false;
}
var ws = plus.webview.getDisplayWebview();
// console.log(JSON.stringify(ws));
var isHome = false;
for (var i = 0; i < ws.length; i++) {
if (ws[i].id && ws[i].id.indexOf("home") != -1) {
isHome = true;
}
}
if (!isHome) {
plus.webview.close(ws[ws.length - 1]);
return false;
}
return isHome;
}
});
网友评论