jQuery change input type

Question

This code doesn't work what's wrong?

$(".re").focus(function() {
    if($(this).attr("type") == "text") {
        $(this).attr("type", "password");
    }
}); 

It's supposed to change the input text type from text, to password, but doesn't work when I type in it after I get into focus on it; it's still text.

Answer 1

IE won't allow you to do this, so jQuery specifically forbids it to be cross-browser consistent. To change the type (and it work in every browser) you need to replace the element with one of the other type.

Answer 2

As Nick said you can't do this, but what you can do is have two inputs right next to eachother, with the password hidden. On focus, toggle each and .focus() the password.

jQuery

$('.text').focus(function() {
    $(this).toggle();
    $('.pass').toggle().focus();
});​

Fiddle http://jsfiddle.net/KUFZY/