The default value is "password" for the input field, show it?

Question

I use this js to display the default password when the user clicks on it, automatically clears the default value if the user deselects without entering the default value that appears again.

I used it for all my fields, but obviously for a password it is more complicated! :)

How do you do this?

<input type="password" onblur="this.value=!this.value?'Password':this.value;" onfocus="this.select()" onclick="if (this.value=='Password'){this.value='';}" name="pwd" id="user_pass" class="input" value="Password" size="20" tabindex="20" /> 

Answer 1

This is your solution: http://jsfiddle.net/cgP5K/1/

 <input type="text" onblur="this.value=!this.value?'Password':this.value;" onfocus="this.select()" onclick="if (this.value=='Password'){this.value=''; this.type='password'}" name="pwd" id="user_pass" class="input" value="Password" size="20" tabindex="20" />​ 

Answer 2

Are you thinking of <input placeholder='Password' type='password'/> ?

Answer 3

Try this - http://roshanbh.com.np/examples/text-in-password/

Answer 4

You need to create a simple text input as a placeholder. This code will do this for you without exposing any global scope variables:

 ​<input id="pass-placeholder" type="text"​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ value="Password" /> <script type="text/javascript"> (function(){ var pass_holder_el = document.getElementById('pass-placeholder'); var pass_el = document.createElement('input'); pass_el.type = 'password'; pass_el.onblur = function(){ if(!this.value) this.parentNode.replaceChild(pass_holder_el, this); } pass_holder_el.onfocus = function(){ this.parentNode.replaceChild(pass_el, this); pass_el.focus(); } })(); </script>​ 

Jsfiddle

Answer 5

Please use the solution below,

 <input name="password" class="input"value="Password" size="20" tabindex="20" onclick="if(this.value==defaultValue){this.value=''; this.type='password'} else if(this.value==''){this.value=defaultValue; this.type='text'} " onblur="if(this.value==''){this.value=defaultValue; this.type='text'}"/> 

because the first solution works well, but if u is empty the password field is not converted to the default value, which is text. So try the solution.