Текстовое поле с заполнителем / подсказкой И фокусом - возможно?

Question

У нас есть опрос, где на некоторых страницах есть один вопрос textarea. Поскольку это единственный вход, мы хотим, чтобы он фокусировался на загрузке этого блока. Но мы также хотим иметь текст в стиле заполнителя в той же области текста.

Существует довольно много решений для того, чтобы обе функции работали во всех браузерах, таких как Ajaxblender. Но я хочу, чтобы подсказка оставалась после фокуса, а затем исчезала при вводе текста. Есть идеи?

Примечание. Я понимаю, что в спецификациях HTML говорится, что элемент-заполнитель не должен фокусироваться. Так что, возможно, я должен сказать, что я хочу "водяной знак". Этот интерфейс предназначен для пожилых мужчин с низкой компьютерной грамотностью - им нужна любая помощь, которую мы можем им оказать.

Должен работать с IE8:(

Answer 1

Если я понимаю вопрос, вы можете попробовать что-то вроде

HTML

<textarea id="first">Instructions go here</textarea>

JQuery

$('#first').focus().one('keydown', function(){
    $(this).val('');    
});

Пример: http://jsfiddle.net/jasongennaro/AYRyH/

объяснение

1. Пустой .focus() делает акцент на поле при нагрузке.
2. .one() запускает событие один раз для элемента
3. На keydown мы удаляем текущее значение, которое является инструкциями, которые мы добавили в начале.

РЕДАКТИРОВАТЬ

Учитывая ваш комментарий

Мне нужно, чтобы он функционировал немного больше как стандартный заполнитель, поэтому, если вы введете что-то, затем удалите его, чтобы поле оставалось пустым, оно вернется к отображению оригинальной подсказки.

Вы могли бы сделать это... захватить value а затем поместите его обратно в textarea на blur если там ничего нет

var a = $('#first').val();

$('#first').focus().one('keydown', function(){
    $(this).val('');    
});

$('#first').blur(function(){
    if($(this).val() == ''){
       $(this).val(a); 
    }
})

Пример 2: http://jsfiddle.net/jasongennaro/AYRyH/1/