Переопределение сочетания клавиш HTML Select

Question

У меня есть выпадающий список (элемент выбора HTML), который просто содержит кучу долларовых сумм. Э.Г.

$ 50.000

$ 100.000

$ 150.000

$ 200.000

и т. Д.

Пример одного из элементов option внутри него:

<option value="150000">$150,000</option>

Я хочу, чтобы пользователь мог начать печатать с 1..5..0 .. и заставить его автоматически переходить к элементу стоимостью 150 000 долларов - это нормально работает в большинстве браузеров, если у меня его нет Символ $ в моем innerhtml. Но поскольку все мои внутренние описания html имеют префикс со знаком $, все сочетания клавиш идентичны, поэтому фактически бесполезны.

Я предполагаю, что в необработанном HTML нет простого способа указать, что сочетания клавиш должны быть получены из соответствующего атрибута value , а не из innerhtml текста?

Так какой же самый чистый фрагмент jquery для этого?

Answer 1

Если это вообще возможно, я бы просто поставил $ перед выпадающим меню.Это был бы наименее болезненный способ.

Если это не вариант, вы можете рассмотреть возможность использования background-image, содержащего знак $ для каждого option:

select.dollar option { background-image: url(...); 
                       background-position: left center; 
                       background-repeat: no-repeat;
                       padding-left: 20px;
                      }

Поддержка браузера для этого очень, очень ненадежна, хотя - она ​​будет работать, вероятно, только в самой новой версии каждой семьи.Это может вообще не работать в IE, у меня нет удобного обзора.Кроме того, этот способ не подходит для будущей интернационализации.

Кроме этого, я думаю, вам придется прибегнуть к пользовательскому раскрывающемуся списку на основе JavaScript.