ofca
6/1/2013 - 8:22 AM

Nicer version of HTML5 "placeholder" attribute.

Nicer version of HTML5 "placeholder" attribute.

$('[data-placeholder]').each(function() {

    var $this = $(this),
        text = $this.attr('data-placeholder');

    if ($this[0].nodeName == 'TEXTAREA') {
        $this.text(text);
    } else {
        $this.val(text);
    }

    $this
        .on('focus', function() {
            if (this.nodeName == 'TEXTAREA') {
                if ($(this).text() == text) {
                    this.innerHTML = '';
                }
            } else {
                if (this.value == text) { 
                    this.value = '';
                }
            }
        })
        .on('blur', function() {
            if (this.nodeName == 'TEXTAREA') {
                if ($(this).text() == '') {
                    this.innerHTML = text;
                }
            } else {
                if (this.value == '') {
                    this.value = text;
                }   
            }
        });
});