HTML/CSS: How to make "password" input show the password?

Question

How can you make the value in the password field visible? So, when typing your password in the field, it will not show the black dots, but the actual value that you are typing.

Thanks!

edit: Ok, so then a better question might be: How can I force the browser to remember the value in this 'password' field and treat it as a password?

Answer 1

Then is it called password?It is simple text box only.

<input type="text" name="password" id="password" />

Edit: Whether you want like a remember my password?

So if you want to keep the password in the client side then put it in the cookie and if cookie already set replace the password field with cookie value.

Answer 2

Don't make it a password field, make it a normal text box.

If you need to switch the field type dynamically, there is a HOWOTO over on codingforums.com, and also several SO questions:

• Javascript IE6/7/8 change input type
• Changing the <input> type in IE with JavaScript
• Javascript change input type dynamically doesnt work on IE8
• change type of input field with jQuery

To ensure that browsers keep their normal behavior (saving/not saving passwords) you can convert this back to a password field upon submit.

Answer 3

How can you make the value in the password field visible? So, when typing your password in the field, it will not show the black dots, but the actual value that you are typing.

You can't.

You can, however, use a normal text input for the user to type in the password.

I wouldn't recommend this, though - for example, the browser might auto-save whatever you type in it. A autocomplete="off" is mandatory in any case.

Reference:

• MSDN article on input elements in IE; mentions that the element.value property is always asterisks for password inputs, even when accessing it from JS

• MDC: How to Turn Off Form Autocompletion