title: Inserting <object> in current html form
body: <p>I have a webpage with an input box and a button. If a user inputs some values (12345) an object need to appear below or instead of that form (the input box and the button).</p>
  
  <p>I am handling a value check through  and my whole code looks like this:</p>
  
  <pre><code>&lt;form name="form" action="" method="post"&gt;
    &lt;input type="text" name="subject" id="subject" placeholder="UNESI KOD"&gt;
  &lt;/form&gt;
  
  &lt;button onclick="proveriKljuc()" style="margin-top:20px"&gt;Potvrdi!&lt;/button&gt;
  &lt;script&gt;
    function proveriKljuc() {
      if (document.getElementById("subject").value == 12345) {
        document.write(
          "&lt;center&gt;&lt;object id='object1' data='http://termodom.rs/wp-content/uploads/2016/12/akcija1-1.jpg'&gt;&lt;/object&gt;&lt;/center&gt;"
        );
      }
    }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Currently this code is showing a object in a new window (only a object on the page).</p>
  
  <p>Also this is offtopic but if you can help, how can I handle if enter is pressed to activate function <code>proveriKljuc()</code>?</p>