Заполните 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 открывает, затем загружает новые элементы и отображает их, находясь в открытом состоянии.