Выделить часть текста в теге параметра - PullRequest
0 голосов
/ 09 марта 2012

Меня попросили создать список выбора, который выглядит следующим образом:

enter image description here

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

HTML:

<select id="select-list">
    <option value='1'><em>*</em>A value</option>
    <option value='2'><span>*</span>Another value</option>
</select>

Выведите обработанный HTML:

$('select-list').select('option').each(function(element) {
   console.log($(element).innerHTML);
});

* Значение

* Другое значение

Может кто-нибудь предложить метод для этого?Можно использовать JavaScript (прототип), но я не хочу заменять элемент select.

Демо-скрипта: http://jsfiddle.net/ejUvt/2/

Редактировать: Я рассмотрел удалениезвездочку из текста и использование фонового изображения вместо этого, но я не уверен, что это было бы плохо с точки зрения доступности для пользователей с программами чтения с экрана и подобными текстовыми настройками?Внизу формы есть сообщение о том, что * = required, не может ли вас сбить с толку тот факт, что выбранный элемент не отмечен звездочкой?

1 Ответ

3 голосов
/ 09 марта 2012

Теги option не могут содержать разметку HTML, согласно этой спецификации W3 .Внутри них разрешены только нормальные символьные данные .

Обходной путь: использование фонового изображения (со звездочкой или чем-то еще) (с позицией слева) и добавление левого отступа к элементу option;хотя это может работать во всех браузерах.

...