Показать вариант выбора вверху списка

Question

Используя простой список <select> с большим количеством элементов <option>, я пытаюсь отобразить выбранную опцию в верхней части списка выбора (в настоящее время она отображается внизу, когда список снова отображается) .

Моя среда использует bootstrap и jQuery, но нас не интересует другой сторонний код, если мы можем его избежать. Решение должно работать в Chrome и Safari, но чем больше поддержка, тем лучше.

EDIT: В соответствии с запросом приведен пример использования простого списка <select> с множеством элементов <option>.

• Щелкните раскрывающийся список, чтобы отобразить список параметров.
• Нажмите на номер варианта 25.
• Нажмите на раскрывающийся список, чтобы снова отобразить список параметров.
• Обратите внимание, что выбранная опция отображается внизу списка.
• Напомним, что я пытаюсь, чтобы выбранная опция отображалась в верхней части списка выбора, когда список отображается снова.

РЕДАКТИРОВАТЬ 2: мотивация состоит в том, чтобы облегчить пользователю выбор следующего элемента в списке. В настоящее время им нужно прокрутить вниз, а затем щелкнуть следующий элемент, но в идеале им не нужно было бы прокручивать, чтобы выбрать наиболее вероятный элемент «следующий за выбранным».

<select id="example">
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
  <option>6</option>
  <option>7</option>
  <option>8</option>
  <option>9</option>
  <option>10</option>
  <option>11</option>
  <option>12</option>
  <option>13</option>
  <option>14</option>
  <option>15</option>
  <option>16</option>
  <option>17</option>
  <option>18</option>
  <option>19</option>
  <option>20</option>
  <option>21</option>
  <option>22</option>
  <option>23</option>
  <option>24</option>
  <option>25</option>
  <option>26</option>
  <option>27</option>
</select>

Answer 1

Используя jquery, при изменении выбора вы можете добавить выбранную опцию. что означает просто добавить в начало (в отличие от добавления, что означает добавить в конец).

$('#example').on('change', function() {

  var opt = $(this).find('option:selected');
  $(this).prepend(opt);

});

Вот рабочая скрипка .

Answer 2

Если вы знаете значение опции, которую хотите выбрать, используйте ниже:

$("#id_of_select_element").val(3);