Исчезающий текст в поле ввода HTML5 и jQuery

Очень часто клиенты требуют, чтобы текст в поле ввода исчезал при появлении на нем фокуса, и появлялся обратно при потере фокуса и при условии что в поле ничего не было введено.

В HTML5 это можно сделать используя атрибут data- и jQuery.

Разметка в этом случае будет выглядеть следующим образом:

<input type="text" value="Placeholder text" data-value="Placeholder text"/>

jQuery код будет следующим:

$('body').on('focus', 'input[type=text]',function() {
    if ($(this).val() == $(this).data('value')) {
        $(this).val('');
    }
}).on('blur', 'input[type=text]',function() {
    if ($(this).val() == '') {
        $(this).val($(this).data('value'));
    }
});