title: why input text not deleted when press back button?
body: <p>I make a simple demo in which I restrict pop up screen not to close when back button press .But I am able to do that but when I write something on text field I am not able to delete text.
  can we do both thing ? mean restrict pop up screen as well as delete text from the text field ?</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;link href="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css" rel="stylesheet" type="text/css" /&gt;
  &lt;script src="http://code.jquery.com/jquery-1.11.0.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.js"&gt;&lt;/script&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;title&gt;JS Bin&lt;/title&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
    &lt;div data-role="page"&gt;
    &lt;div data-role="header"&gt;
      &lt;h1&gt;Welcome To My Homepage&lt;/h1&gt;
    &lt;/div&gt;
  
    &lt;div data-role="main" class="ui-content"&gt;
      &lt;a href="#myPopup" data-rel="popup" class="ui-btn ui-btn-inline ui-corner-all"&gt;Show Popup&lt;/a&gt;
  
      &lt;div data-role="popup" id="myPopup" data-dismissible='false'&gt;
  
      &lt;div data-role="fieldcontain"&gt;
          &lt;label for="testCaseIDValue"&gt;TestCase Name:&lt;/label&gt;
          &lt;input type="text" name="testCaseIDValue" id="testCaseInnerIDValue" value="" class="inputTextTestCase"/&gt;
      &lt;/div&gt;
      &lt;a href="#" data-role="button" id="doneInnerPopUp" class="common-button"&gt;Done&lt;/a&gt;
    &lt;/div&gt;
  
    &lt;div data-role="footer"&gt;
      &lt;h1&gt;Footer Text&lt;/h1&gt;
    &lt;/div&gt;
  &lt;/div&gt; 
  
  &lt;/body&gt;
  &lt;/html&gt; 
  </code></pre>
  
  <p>js Code</p>
  
  <pre><code>$('body').keydown(function(e) {
  
      if($('#myPopup').is(':visible')) {
          if(e.keyCode == 8) { // 8 is backspace
              e.preventDefault();
          }
      }
  
  });
  </code></pre>