JQuery - в KeyDown стереть текст из ввода

Question

У меня есть поле ввода, в котором у меня есть текст на сайте

<input type="text" value="Enter Name"/>

Теперь мне нужно добавить, что когда пользователь начинает что-то вводить (вводит первую букву), мой текст исчезнет, ​​и онбудет в состоянии ввести ввод, который он хочет.

Я пытался сделать:

$('#input').keypress(function () {
                $(this).val("");
            });

Но тогда пользователь может ввести только одну букву, потому что он продолжает удалять текст.

Как это можно сделать?

Спасибо

Answer 1

Вы можете сделать это, используя заполнитель

Демо: http://jsfiddle.net/9VhYZ/

Некоторые браузеры пока не поддерживают это, добавление запасного варианта также может быть хорошей идеей для поддержки перекрестногобраузер: http://davidwalsh.name/html5-placeholder

ОБНОВЛЕНИЕ : Вы можете делать то, что просите, вот так: http://jsfiddle.net/9VhYZ/1/

$('#input').one("keydown", function () {
    $(this).val("");
});

Answer 2

Часто эту технику называют Ghosting.Вы можете использовать атрибут заполнителя плюс прогрессивное улучшение.Часто мне нравится делать это, используя класс ghostInput и применять его глобально при загрузке страницы, чтобы я мог добавлять свойства-призраки к элементам, просто добавляя глобальный класс.Я захочу добавить и удалить другой класс из входных данных, чтобы текст выглядел немного светлее, что довольно легко.Просто удалите его в фокус () и добавьте его на пустой размытия ().

Answer 3

Вы реализуете значение по умолчанию для текстового поля.

У вас есть два варианта:

• Плагин: http://plugins.jquery.com/project/default-value
• атрибут HTML5 placeholder="Value".

HTML5 поддерживается не всеми браузерами, поэтому я бы попробовал оба.

Answer 4

Я бы рекомендовал использовать атрибут HTML5 placeholder вместо JavaScript:

<input type="text" value="Enter Name" placeholder="something"/>

Будьте осторожны - он не поддерживается повсеместно, но если у вас есть возможность игнорировать старые браузеры, тогда это определенно решение.