Clear inputs onfocus, refill onblur

the more elegant version ;)

by shapeshifta

HTML

<input class="clear" value="toller Text" />
<input class="clear" value="toller Text2" />
<input class="clear" value="toller Text3" />
<input class="clear" value="toller Text4" />

CSS

.idleField {border:1px solid #666}
.focusField {border:1px solid #00f}

JavaScript

$.fn.clear = function() {
    return this.each(function() {
        $(this)
            .addClass("idleField")
            .bind('focusin focusout', function(e) {
            var el = this;
            if (e.type === 'focusin') {
                $(el)
                    .removeClass("idleField")
                    .addClass("focusField");
                if (el.value === el.defaultValue) {
                    el.value = '';
                }
            } else {
                $(el)
                    .removeClass("focusField")
                    .addClass("idleField");
                if (el.value === '') {
                    el.value = el.defaultValue;
                }
            }
        });
    });

};
$('input').clear().css('color', 'blue');