Update: I have created a better version of this script that, among other improvements, supports password fields, unlike the code below.
Placeholder is a very useful attribute of the <input> tag that is specified in the HTML5 spec. It provides a text that goes into the field, by default, and is used as a kind of a quick tip for the user about what they should type into the field, such as “type to search”, or “type in username”. The nice thing about “placeholder”, as oppose to, for example, simply setting some value for the field, is that it automatically disappears when the user starts typing something in, but it reappears if the user ends up leaving the field empty. Unfortunately this attribute, and its functionality, is actually not supported by most browsers, including Firefox 3.6 and IE8, it is however supported by Chrome 4, and possibly Safari 4 though I can’t vouch for the latter.
I recently had a few projects that needed this functionality, and while some of them had email, password and other fields that required validation, one needed just very simple text fields with placeholder text. So I wrote this very simple javascript function, using jQuery, to do just that (I’m using jQuery 1.4.2 here). Read more »
