Это на самом деле возможно с HTML + Javascript, несмотря на то, что везде люди говорят, что это не так.
Однако это работает только в Chrome. Читайте больше, если вам интересно.
Согласно W3C Working Draft для HTML5, раздел 3.2.5.1.7. Интерактивный контент :
Некоторые элементы в HTML имеют поведение активации, что означает, что пользователь может активировать их. Это запускает последовательность событий, зависящих от механизма активации [...] , например, с использованием клавиатуры или голосового ввода, или с помощью щелчков мыши .
Когда пользователь запускает элемент с определенным поведением активации способом, отличным от щелчка по нему, действием по умолчанию для события взаимодействия должно быть выполнение шагов активации искусственного щелчка по элементу.
<select> Будучи интерактивным контентом, я полагал, что можно программно отображать его <option> s. После нескольких часов игры я обнаружил, что использование document.createEvent() и .dispatchEvent() работает.
Тем не менее, демонстрационное время. Вот рабочая скрипка.
HTML:
<select id="dropdown">
<option value="Red">Red</option>
<option value="Green">Green</option>
<option value="Blue">Blue</option>
</select>
<br>
<button id="fire" type="button" onclick="runThis()">Show dropdown items</button>
Javascript:
// <select> element displays its options on mousedown, not click.
showDropdown = function (element) {
var event;
event = document.createEvent('MouseEvents');
event.initMouseEvent('mousedown', true, true, window);
element.dispatchEvent(event);
};
// This isn't magic.
window.runThis = function () {
var dropdown = document.getElementById('dropdown');
showDropdown(dropdown);
};
Если кто-то найдет способ сделать то же самое, но не в Chrome, , пожалуйста, не стесняйтесь изменить эту скрипку .