JqueryMobile (SPA) Disable Browser backbutton and Refresh?

Question

hi i am using jqueryMobile SPA template for my phone-gap app.

For web version my requirement is to disable or show warning message to user on click of browser back button. I googled my requirement but didn't find any desired solution.Please guide me . Thanks.

Answer 1

To disable Backbutton of browser i used

 $(window).on("navigate", function (event) {
     event.preventDefault();
     window.history.forward(1);

});

But on pressing f5 it was creating error and redirecting me to login page.Thus i disable f5 ,ctrl+R button.

 var ctrlKeyDown = false;
 $(document).on("pagecreate", function (){    
    $(document).on("keydown", keydown);
    $(document).on("keyup", keyup);
 });

 function keydown(e) { 
   if ((e.which || e.keyCode) == 116 || ((e.which || e.keyCode) == 82 && ctrlKeyDown))
    {
     // Pressing F5 or Ctrl+R
     e.preventDefault();
    } else if ((e.which || e.keyCode) == 17) {
    // Pressing  only Ctrl
    ctrlKeyDown = true;
  }
}

function keyup(e){
  // Key up Ctrl
 if ((e.which || e.keyCode) == 17) 
    ctrlKeyDown = false;
}

It completely fulfilled my requirement.Thanks to Suhas :) .

Answer 2

Try this- FIDDLE

$(window).on("navigate", function (event, data) {
    var direction = data.state.direction;
    if ( !! direction) {
        alert(direction);
    }
});

Please refer following link.

Refer This

Or you can use

window.history.forward(1);

when back button get pressed. But it loads and then redirected not proper way.