title: Can't prevent form posting on hitting return on text input
body: <p>In my code example when you put your cursor in one of the two input fields and then press ENTER on your keyboard, a timestamp number is displayed in a div underneath. Press ENTER again and it changes.</p>
  
  <p>If you take one of the text fields out so there's only one, then form seems to post (reload the page).</p>
  
  <p>I can't figure out why this happens when there's only one input field.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function handleKeyPress(event) {
    if (event.keyCode == 13)
      document.getElementById('theButton').click();
  }
  function theFunc() {
    document.getElementById("theTime").innerHTML = Math.floor(Date.now());
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;form&gt;
    &lt;input type="text" name="textInput" onKeyPress="handleKeyPress(event)"&gt;&lt;br&gt;
    &lt;input type="text" name="textInput2" onKeyPress="handleKeyPress(event)"&gt;&lt;br&gt;
    &lt;input type="button" value="Submit" id="theButton" onclick="theFunc()"&gt;
  &lt;/form&gt;
  
  &lt;div id="theTime"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>