Заполните HTML-раскрывающийся список по клику
У меня есть страница, которая содержит несколько HTMLselect
выпадающих и требует населенияonclick
элемента. Это заполнение выполняется с помощью вызова AJAX в прослушивателе событий clickselect
элементы.
Причина этого заключается в том, что производительность и загрузка очень важны, и поэтому они не могут быть заполнены при загрузке страницы.
Также дизайндолжен использовать нативный HTMLselect
элемент.
Я создал демо jsFiddle, чтобы показать проблему. Когда вы нажимаете наselect
элементы заполнены, а ширинаselect
увеличивается в результате.
Однакоselect
отображает только начальную опцию (до заполнения AJAX).
Демо используетsetTimeout()
50 миллисекунд для эмуляции времени отклика AJAX.
Как я могу получить это, чтобы заполнитьonclick
и правильно отображать?
Есть ли способ открытьselect
на обратный вызов ответа населения?
РЕДАКТИРОВАТЬ: В качестве альтернативы, есть ли выпадающий плагин jQuery, который использует родную тему браузера для стилизации?
Что я пробовал до сих пор
Заселениеselect
при наведении, однако быстрый пользователь может открытьselect
до загрузки параметров. Кроме того, если пользователь должен был прокрутить всю страницу вниз, и по каждомуselect
, это вызовет много ненужных вызовов AJAX.Изменение слушателя события наfocus
вместоclick
(как@AndyPerlitch предложил). Однако это не сработает, если на запрос AJAX потребуется всего 50 миллисекунд. (Посмотреть демо)Изменение слушателя события наmousedown
имеет тот же эффект, что иfocus
ОБНОВИТЬ: Это не проблема в FireFox.select
открывает, затем загружает новые элементы и отображает их, находясь в открытом состоянии.