Вопрос по javascript, jquery, css – Value / Placeholder - разные стили для слов

4

У меня проблема с заполнителями. Я хочу спросить, есть ли возможность стилизовать значение в полях ввода, но в способе стилизовать слова с этим значением разные.

Например, если у нас есть поле ввода, которое имеет начальное значение"First Name" я хочу иметьgreen color за"First", а такжеred color за"Name" (это всего лишь пример).

Это вообще возможно?

Примечание. Я использую значение в качестве & quot; заполнителя & quot; (вместо атрибута заполнителя html) из-за того, что.

<input type="text" value="First Name" onFocus="if (this.value == 'First Name') {this.value = '';}" onBlur="if (this.value == '') {this.value = 'First Name';}" />
Вы всегда можете иметь разные стили для полей имени и фамилии = P И добро пожаловать в stackoverflow, не стесняйтесь спрашивать и учиться. PicoCreator
Я видел большие обходные пути для желаемого эффекта. По сути, поле ввода будет находиться на верхнем слое с текстом, использующим прозрачный шрифт (все пустые), после чего текстовая область за ним будет заполняться пользовательским синтаксисом, который обновляется при изменении значения через javaScript. Это довольно обходной путь, и он не работает в iOS (если я правильно помню) ... В качестве альтернативы вы можете получить расширенный текстовый редактор, но это может быть излишним для чего-то вроде ввода имени пользователя. PicoCreator
У меня есть несколько полей ввода для этой формы, поэтому я, вероятно, снова буду использовать один стиль (это лучшее решение для чего-то подобного, как я вижу):) ... Спасибо cool

Ваш Ответ

2   ответа
0

color атрибут стиля. Отдельные цвета для каждого слова намного сложнее. Вы должны иметь наложение, которое отображает правильные цвета. Кроме того, курсор исчезнет, так что пользователь не будет знать, где он находится в данный момент.

Error: User Rate Limit Exceeded cool
3

это невозможно. Когда дело доходит до стилизации элементов формы, есть много препятствий, цвет можно установить для элемента, а не для символов, попробуйте это:

http://jsfiddle.net/Fgd2e/1/

Error: User Rate Limit ExceededaddClass removeClassError: User Rate Limit Exceeded
Error: User Rate Limit Exceeded cool
Error: User Rate Limit Exceeded cool

Похожие вопросы