title: javascript: how to stop the page from reloading?
body: <p>I just wrote a small program which takes the input from user and shows the factorial table. Here is the code:</p>
  
  <pre><code>&lt;h1&gt;Table of factorials&lt;/h1&gt;
  &lt;h3&gt;Enter the number:&lt;h3&gt;
  &lt;form name="form1"&gt;
      &lt;input type="text" name="num" onchange="display(parseInt(document.form1.num.value))"/&gt;
      &lt;input type="button" /&gt;
  &lt;/form&gt;
  &lt;script&gt;
      function factorial(n){
          if(n&lt;=1) return n;
          else return n*factorial(n-1);
      }
      function display(x){
          document.write("&lt;table&gt;");
          document.write("&lt;tr&gt;&lt;th&gt;n&lt;/th&gt;&lt;th&gt;n!&lt;/th&gt;&lt;/tr&gt;");
          for(var i =1;i&lt;=x;i++){
              document.write("&lt;tr&gt;&lt;td&gt;"+i+"&lt;/td&gt;&lt;td&gt;"+factorial(i)+"&lt;/td&gt;&lt;/tr&gt;");
          }
          document.write("&lt;/table&gt;");
          document.write("Generated at"+ new Date());
      }
  
  
  &lt;/script&gt;
  </code></pre>
  
  <p>But the problem is the form reloads again immediately after showing the table.
  But if i use the button to trigger the function by <code>onclick="display(parseInt(document.form1.num.value))"</code> it does fine.<br/>  How to fix this?<br/><br/>
  <strong>EDIT:</strong> Just noticed that it works fine in firefox too. The problem is with chrome, opera and safari </p>