title: How to disable input/click on textbox/image using JavaScript?
body: <p>I am trying to disable input event in textbox and click event on image in JavaScript.</p>
  
  <p>Here is my HTML:</p>
  
  <pre><code>&lt;div id="div1"&gt;
      Img1: &lt;img id="img1" onclick="alert('Clicked Div1');" /&gt;
  &lt;/div&gt;
  
  &lt;div id="div2"&gt;
      txt1: &lt;input type="text" id="txt1" /&gt;
  &lt;/div&gt;
  
  &lt;input type="button" value="Disable It"  onclick="disable();" /&gt;
  &lt;input type="button" value="Enable It"  onclick="enable();" /&gt;
  </code></pre>
  
  <p>This is JavaScript:</p>
  
  <pre><code>function disable()
  {
      document.getElementsByName('txt1').disabled = true;
      document.getElementById("div1").disabled = true;
      document.getElementById("div2").disabled = true;
      document.getElementById("img1").disabled = true;
  }
  function enable()
  {
      document.getElementsByName('txt1').disabled = false;
      document.getElementById("div1").disabled = false;
      document.getElementById("div2").disabled = false;
      document.getElementById("img1").disabled = false;
  }
  </code></pre>
  
  <p>In the above code only image is disabled by <code>document.getElementById("img1").disabled = true;</code> that too only on IE8. It doesn't work on Chrome (V 32.0.1700.107 m) and Firefox (26.0).</p>
  
  <p>I tried the JavaScript given in <a href="https://stackoverflow.com/a/8423836/1369235">this answer</a>. But it doesn't work on Chrome and Firefox. </p>
  
  <p>How can I do this? Am I missing anything? I am trying to achieve this using JavaScript (not <a href="https://stackoverflow.com/q/639815/1369235">jQuery</a>).</p>