title: Javascript backbutton event listener overrides the android device back button
body: <p>I have created <code>Android app</code> using <code>cordova 2.6.0</code>. I have implemented a <code>menu</code> feature in my app using <code>html</code> markups and <code>jQuery</code> which toggles on interacting with device's <code>menubutton</code>. But I could not figure out to achieve the following requirement, to behave like a native app.</p>
  
  <p><strong>Requirement</strong></p>
  
  <p>The <code>menu</code> should hide on pressing device's <code>backbutton</code> if the <code>menu</code> is <code>visible</code>. If the <code>menu</code> is not visible the <code>backbutton</code> should now act normally, which is, either it should <code>exit</code> the <code>app</code> or go to the <code>back history</code>.</p>
  
  <p><strong>This is my code</strong></p>
  
  <pre><code>document.addEventListener('deviceready', function(){
  
  document.addEventListener('menubutton', function(){
  //Toggle Menu
  //Which is working fine
  });
  
  document.addEventListener('backbutton', function(){
  if(menu is visible) {
    //Hide the menu
    //This is also working fine
  return false;
  } 
  
  //BUT the default action of backbutton has gone. It cannot exit the app , neither it brings to back history.
  
  //return true;
  //I have also tried to return boolean true , but facing the same problem.
  });
  
  }, false);
  </code></pre>
  
  <p><strong>The actual problem</strong></p>
  
  <p>If I attached an <code>eventlistener</code> for <code>backbutton</code> the device's <code>Back Button</code> is disabled, It does not works as normal.</p>
  
  <p><strong>My question is</strong></p>
  
  <p>Is <code>document.addEventListener('backbutton', function(){});</code> over riding the device's back button? How to get rid of it?</p>
  
  <p><strong>This is happening on Android 4.1.2 Device</strong></p>