Менять содержимое выпадающего списка, пока оно открыто?

Question

У меня есть выпадающий список с некоторыми элементами.Когда пользователь выбирает один из них, я бы хотел, чтобы раскрывающийся список оставался открытым и был заполнен новыми элементами.Затем пользователь выбирает один из них, и, наконец, раскрывающийся список закрывается.

Можно ли это сделать в JavaScript?И если да, то как?

Answer 1

для науки! Я создал альтернативный ответ, чтобы проверить это. Вы можете проверить эту скрипку , которая содержит этот HTML:

<select id="y">
    <option>click to open dropdown</option>
    <option>do not choose this!</option>
</select>

И следующий Javascript:

var t = 10;

var x = window.setInterval(function() {
    console.log(--t);
    if (t === 0) { act(); }
}, 1000);

function act() {
    var select = document.getElementById('y');
    var newOption = document.createElement('option');
    newOption.innerHTML = "this option will not appear if the select is open while it's added";
    select.appendChild(newOption);
}

Если вы откроете раскрывающийся список и оставите его открытым , пока не истечет таймер, вы увидите следующее поведение:

• ✗ Chrome 29 : опция не видна, пока не откроется снова + раскрывающийся список для ширины новой опции;
• ✗ IE10 / 9/8 : так же, как Chrome 29 +, он принудительно сворачивает раскрывающийся раскрывающийся список
• ✓ Firefox 23 : добавляет опцию без необходимости повторного открытия + настраивает ширину для новой опции

Answer 2

Не без замены собственного элемента управления на пользовательского .