使用Cordova –實現點選手機物理返回鍵時,應用進入後臺執行,而不是直接關閉!

~~馬發表於2018-04-17

使用Cordova開發App時,點選手機back鍵,總是返回上一級,如果希望直接返回到桌面,而不是直接關閉程式,可以這麼做!

1.安裝外掛

首先在工程目錄下執行如下命令新增backbutton外掛

cordova plugin add cordova-plugin-backbutton 

2.例子

在返回鍵的響應事件中呼叫外掛的goHome方法

<!DOCTYPE html>

<html>
    <head>
        <title>hangge.com</title>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
        <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
        <script type="text/javascript" charset="utf-8">
            //頁面載入後新增各事件監聽
            function onLoad() {
                document.addEventListener("deviceready", onDeviceReady, false);
            }
 
            //Cordova載入完畢
            function onDeviceReady() {
              //監聽返回鍵按鈕事件
              document.addEventListener("backbutton", eventBackButton, false);
            }
 
            //返回鍵點選響應(主要)
            function eventBackButton() {
              //進入後臺
              navigator.Backbutton.goHome(function() {
                  console.log(`go home success`);
              }, function() {
                  console.log(`go home fail`);
              });
            }
 
        </script>
    </head>
    <body onload="onLoad()">
    </body>
</html>
3.總結
此例宜變通使用
cordova使用過程中坑還是很多的,各位同學應踩坑,填坑,切不可遇坑則退,另推薦一個不錯的UI框架Onsen UI,很好的相容了Android和ios,並且可以完美結合Angular.js, React, Vue.js等流行框架使用。
道阻且長!!!!

相關文章