Question

This is the code I have already. When the box is inactive it displays the text”Password”. I would like when the box is selected it removes the “Password” text and displays the users input as dots like a password field.

<div class="custom"><input type="text" class="custom" size="12" value="Password" onfocus="if(this.value == 'Password') { this.value = ''; }" onblur="if(this.value == '') { this.value = 'Password'; }"/></div>

Answer 1

You can change the type via JS the same way you’ve changed the value:

<input type="text" class="custom" size="12" value="Password" onfocus="if(this.value == 'Password') { this.type = 'password'; this.value = ''; }" onblur="if(this.value == '') { this.type = 'text'; this.value = 'Password'; }"/>