Выпадающая форма выбора, перейдите на URL-адрес в поле SUBMIT

Question

Есть ли простой способ заставить пользователя перейти по URL-адресу из выпадающего списка в SUBMIT, а не onChange.

У меня есть этот код:

<form name="cityselect"> 
<select name="menu" onChange="top.location.href=this.options[this.selectedIndex].value;" value="GO"> 
<option selected="selected">Select One</option> 
<option value="http://www.domain-one.com">London</option> 
<option value="http://www.domain-two.com">Glasgow</option> 
</select> 

Пробовал изменения OnChange в onSubmit, но он не работает.

Answer 1

Попробуйте вместо этого.

Также: Вы хотите, чтобы ваш JavaScript был отделен от вашего HTML. Не используйте onchange или аналогичные атрибуты HTML. Хотя это технически не так, это плохо с точки зрения качества/обслуживания.

var goBtn = document.getElementById("goBtn"); 
 
var menu = document.getElementById("menu"); 
 

 
goBtn.onclick = function() { 
 
    window.location = menu.value; 
 
}

<select id="menu"> 
 
    <option selected="selected">Select One</option> 
 
    <option value="http://www.domain-one.com">London</option> 
 
    <option value="http://www.domain-two.com">Glasgow</option> 
 
</select> 
 
<input type="button" id="goBtn" value="GO!">

ли эта работа для вас?

Answer 2

Вы можете использовать onsubmit событие на <form> элемента, но вы хотите, чтобы preventDefault на мероприятии, а также для onsubmit случае необходимо использовать return:

<form name="cityselect" onsubmit="return redirectTo(this)"> 
    <select name="menu" value="GO"> 
    <option selected="selected">Select One</option> 
    <option value="http://www.domain-one.com">London</option> 
    <option value="http://www.domain-two.com">Glasgow</option> 
    </select> 
</form> 

<script> 
    function redirectTo(elem) { 
    event.preventDefault(); 
    top.location.href = elem.firstElementChild.options[elem.firstElementChild.selectedIndex].value 
    } 
</script>