F-MIX.COM - это развлекательно-информационный сайт предназначенный для людей с чувством юмора, которые не любят скучать и унывать. На страницах нашего сайта можно найти много интересной и позитивной информации.

Скрипт выбор из списка и переход JavaScript

Опубликовано: 20.06.2022 в 21:27  |  Автор: Admin  |  Просмотров: 86  |  Комментарии: 0

Суть данного скрипта состоит в том, что у нас есть поле со списком, из которого мы выбираем пункт, жмем на кнопку и переходим по ссылке. Давайте сделаем.
Для начала напишем код функции перехода:

<script language="JavaScript" type="text/javascript">
function gotolink(what){
     var selectedopt=what.options[what.selectedIndex]
     if (document.getElementById && selectedopt.getAttribute("target")=="newwin"){
          window.open(selectedopt.value)
     }
     else{window.location=selectedopt.value}
}</script>

Код скрипта готов, теперь создаем простую форму

<form name="gogogo">
<select name="select">
<option value="#">Выберите сайт...</option>
<option value="http://www.yandex.ru">yandex</option>
<option value="http://www.google.ru" target="newwin">google</option>
<option value="http://www.net-f.ru">нэтфорс</option></select>
<input type="button" value="Перейти" onClick="gotolink(document.gogogo.select)">
</form>

Как видите в Google мы добавили параметр target="newwin", благодаря которому, при переходе по ссылке Google будет открыт в новом окне, при переходе по остальным ссылкам, они будут открываться в том же окне, выбирайте сами, что вам больше подходит.

Существует еще один вариант перехода по ссылке, когда вы переходите сразу после выбора элемента из списка. Ну что ж, реализуем и этот вариант. В принципе код мало отличается от предыдущего, изменяется лишь событие OnClick на OnChange

<script language="JavaScript" type="text/javascript">
function gonow(what){
     var selectedopt=what.options[what.selectedIndex]
     if (document.getElementById && selectedopt.getAttribute("target")=="newwin"){
          window.open(selectedopt.value)
     }
     else{window.location=selectedopt.value}
}</script>

 

<form name="form">
<select name="sel" onChange="gonow(document.form.sel)">
<option value="#">Выберите сайт...</option>
<option value="http://www.yandex.ru">Яndex</option>
<option value="http://www.google.ru" target="newwin">Google</option>
<option value="http://www.net-f.ru">НэтФорс</option></select>
</form>

Демонстрация
Похожие материалы
Комментарии
К данной странице комментариев пока нет
Введите Ваше имя:*
Введите Ваш E-mail:*
Ваше сообщение:*
Введите кода безопасности:*