Android：无法捕获JavaScript中的后退按钮

Question

I am using IntelXDK to develop an android app in HTML5, CSS3 and JavaScript, the app is a one page app which works fine while switching views with HTML buttons but when pressing the back button on a mobile device the app exits, however I want to capture this event and display the home screen.

The event works in a simulator but not on a physical device

This is what I have done to capture the backbutton click event but the app just closes:

$(document).ready(function () {

    var animTime = 300,
        clickPolice = false;

    $(document).on('click', '.acc-btn', function () {
        if (!clickPolice) {
            clickPolice = true;

            var currIndex = $(this).index('.acc-btn');

            $('.acc-content').stop().animate({ height: 0 }, animTime);
            $('.acc-content').eq(currIndex).stop().animate({ height: 108 }, animTime);

            setTimeout(function () { clickPolice = false; }, animTime);
        }
    });

    //Back button event
    document.addEventListener('backbutton', function () {
        if ($('#front').hasClass('hidden')) {
            ShowPage('front');
            return false;
        }
        else {
            navigator.app.exitApp();
        }
    }, false);
});

//Show page function etc.....

I know the ShowPage function works fine as it is used elsewhere

Any help is appreciated

Answer 1

Check out the following link for Android - https://software.intel.com/en-us/node/493108

You have to capture the back button and add a virtual page to prevent the app from exiting

document.addEventListener("intel.xdk.device.hardware.back", function() {
//continue to grab the back button
   intel.xdk.device.addVirtualPage(); 

}, false); 

Answer 2

Try to remove the boolean parameter from your addEventListener so

//Back button event
document.addEventListener('backbutton', function () {
    if ($('#front').hasClass('hidden')) {
        ShowPage('front');
        return false;
    }
    else {
        navigator.app.exitApp();
    }
});