I am working on phonegap application. I am facing one issue.

I have four html pages in my application. Every page contains some widgets like a button or a list view on click of button i move to next page. but when i want to e back on first page i can't. that is when I try to e back using back button of device it closes the app.

I am using device's back button and not user defined, so i need to handle that. same as onBackPressed(); in android.

I know it is because of the WebView widget. but unable to find solution.

I am new to JavaScript, CSS, AJAX, jQuery and HTML5.

How to handle back press in phonegap?

I am working on phonegap application. I am facing one issue.

I have four html pages in my application. Every page contains some widgets like a button or a list view on click of button i move to next page. but when i want to e back on first page i can't. that is when I try to e back using back button of device it closes the app.

I am using device's back button and not user defined, so i need to handle that. same as onBackPressed(); in android.

I know it is because of the WebView widget. but unable to find solution.

I am new to JavaScript, CSS, AJAX, jQuery and HTML5.

How to handle back press in phonegap?

• javascript
• jquery
• css
• html
• cordova

• its the same way you are moving to next page, instead use previous page id to go back by adding a button in current page – Greenhorn Commented Sep 4, 2013 at 12:34
• 3 if you can read i wrote there back button of device. please read before down vote somebody, even i know that we it will be a same way for moving from one page to another – MobiDev Commented Sep 4, 2013 at 12:39
• @agrothe: thanks for your help, support and valuable time. will try it. thanks. – MobiDev Commented Sep 4, 2013 at 12:55

3 Answers 3

You can make a workaround to solve this problem.

You can define a function to be triggered when back button is pressed and then verify which page your user is in, and depending on each page run a different action. For example, if he is in page3 then you go back to page 2, if page 2 then go back to page 1 and if he is in page1 you can close the application.

Wrote an example for you:

    <script type="text/javascript" charset="utf-8" src="phonegap-1.0.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    document.addEventListener("deviceready", onDeviceReady, false);

    // PhoneGap is loaded and it is now safe to make calls PhoneGap methods
    function onDeviceReady() {
        // Register the event listener
        document.addEventListener("backbutton", onBackKeyDown, false);
    }

    // Handle the back button
    function onBackKeyDown() {
        var whichPage = functionToDetectCurrentPage(); //create a function or detect it somehow
        switch(whichPage){
            case "Page1":
              //works only in android, iOS not quite sure, but heard it's not possible
              //to do programatically
              navigator.app.exitApp();
              break;
            case "Page2":
              window.location = "Page1.html";
              break;
            case "Page3":
              window.location = "Page2.html";
              break;
            case "Page4":
              window.location = "Page2.html";
              break;
        }
    }

Take a look at phonegap documention. http://docs.phonegap./en/1.0.0/phonegap_events_events.md.html#backbutton

Let us know whether it helps you!

It may not be possible for an inbrowser app.

See related SO answer at: Handle Android Back Button on Phonegap InAppBrowser

You can use "backbutton" event for this.

Syntax :

document.addEventListener("backbutton", yourCallbackFunction, false);

And you can write your "yourCallbackFunction" like this.

function yourCallbackFunction(){
    window.history.back();
 }

Link to Documentation