Бывают задачи, когда мы хотим перенаправить пользователя по ссылке при выборе того или иного option в теге списка select. Сделать это просто вставкой ссылок не получится (переход по ссылке не будет происходить).

Однако есть вполне несложный способ реализовать эту задачу.

Select с рабочими ссылками

Итак, для того, чтобы реализовать переход по ссылкам при выборе какого либо option у тега select нам нужно сделать все две вещи:

1. Поместить необходимую ссылку в атрибут value тега option.
2. Повесить на тег select событие onchange и когда оно происходит перенаправлять по ссылке из выбранного option.

Код всего этого может выглядеть примерно следующим образом:

<div>
  <select class="form-select" onchange="window.location.href = this.options[this.selectedIndex].value">
      <option selected disabled>Куда перейти:</option>
      <option value="https://getbootstrap.com/">Bootstrap Doc</option>
      <option value="https://website-create.ru">Website-create.ru</option>
  </select>
</div>

Результат работы можете посмотреть ниже, через CodePen.

Как видите, реализовать переход из select option совсем не сложно.

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

Всем удачи.