CODEWITHSUNDEEP
javascripthtml
acctman
acctman

Reputation: 4349

Pre-fill input text box

Does anyone know of a good small piece of code that will prefill my user and pass input box with the text username and password. I've seen so jscript that will do it but i'm looking for something that is a few lines a code.

similar to how the search text is in the search box up top on the right

Upvotes: 0

Views: 27778

Answers (2)

Phil McCullick
Phil McCullick

Reputation: 7170

For browsers that support HTML5, adding placeholder="search" will add the prefill text automatically.

The search text box at the top of the page has:

<input type="text" placeholder="search" >

You can use an HTML5 shim to make this backwards compatible. Example: http://kamikazemusic.com/web-development/revisiting-html5-placeholder-fixes/

Upvotes: 18

Saket
Saket

Reputation: 46137

You can use the following:

<input type="text" style="color:#ccc;" value="username" onfocus="this.value = this.value=='username' ? '' : this.value; this.style.color='#000';" onfocusout="this.value = this.value == '' ? this.value = 'username' : this.value; this.value=='username' ? this.style.color='#ccc' : this.style.color='#000'"/>

<input type="text" style="color:#ccc;" value="password" onfocus="this.value = this.value=='password' ? '' : this.value; this.style.color='#000';" onfocusout="this.value = this.value == '' ? this.value = 'password' : this.value; this.value=='password' ? this.style.color='#ccc' : this.style.color='#000'"/>

Upvotes: 2

Related Questions