title: Changing the <input> type in IE with JavaScript
body: <p>This code below works in all web browsers except IE:</p>
  <pre><code>&lt;input type=&quot;text&quot; name=&quot;passwordLogin&quot; value=&quot;Password&quot; onfocus=&quot;if(this.value=='Password'){this.value=''; this.type='password'};&quot; onblur=&quot;if(this.value==''){this.value='Password'; this.type='text'};&quot; size=&quot;25&quot; /&gt;
  </code></pre>
  <p>How can I fix it for IE?</p>
  <p>I did some changes, but it still has an error.</p>
  <p>I want it to work like this like here:</p>
  <pre><code>&lt;input type=&quot;text&quot; name=&quot;usernameLogin&quot; value=&quot;Email&quot; onfocus=&quot;if(this.value=='Email'){this.value=''};&quot; onblur=&quot;if(this.value==''){this.value='Email'};&quot; size=&quot;25&quot; /&gt;
  </code></pre>
  <p>if I don't enter anything it will put the value back.</p>
  <p>So I tried this:</p>
  <pre><code>&lt;td colspan=&quot;2&quot; id=&quot;passwordLoginTd&quot;&gt;
       &lt;input id=&quot;passwordLoginInput1&quot; type=&quot;text&quot; name=&quot;passwordLogin&quot; value=&quot;Password&quot; onfocus=&quot;passwordFocus()&quot; size=&quot;25&quot; /&gt;
       &lt;input id=&quot;passwordLoginInput2&quot; style=&quot;display: none;&quot; type=&quot;password&quot; name=&quot;passwordLogin&quot; value=&quot;&quot; onblur=&quot;passwordBlur()&quot; size=&quot;25&quot; /&gt;
      &lt;/td&gt;
      &lt;script type=&quot;text/javascript&quot;&gt;
      //&lt;![CDATA[
      
       passwordElement1 = document.getElementById('passwordLoginInput1');
       passwordElement2 = document.getElementById('passwordLoginInput2');
      
       function passwordFocus() {
       
        passwordElement1.style.display = &quot;none&quot;;
        passwordElement2.style.display = &quot;inline&quot;;
        passwordElement2.focus();
       
       }
       
       function passwordBlur() {
       
        if(passwordElement2.value=='') {
        
         passwordElement2.style.display = &quot;none&quot;;
         passwordElement1.style.display = &quot;inline&quot;;
         passwordElement1.focus();
        
        }
       
       }
      
      //]]&gt;
      &lt;/script&gt;
  </code></pre>
  <p>as you can see the blur does not work.</p>
  <p>Finally I got it, I needed to remove:</p>
  <pre><code>passwordElement1.focus();
  </code></pre>