Перейти к другому url при нажатии кнопки
Мне нужно создать html-код, в котором, если пользователь выберет элемент из выпадающего списка и нажмите кнопку, он перейдет по соответствующей ссылке.
<select name="myList">
<option value="Google" />Google
<option value="yahoo" />yahoo
<option value="Ask" />Ask
</select>
если пользователь выбирает Google из выпадающего списка и нажимает кнопку, то страница должна быть перенаправлена наwww.google.com и если он выбирает yahoo и нажимает кнопку, следует перейти кwww.yahoo.com
Я хотел бы отметить, что мне нужна кнопка в этом случае. Я не хочу уходить. сайт на выпадающем выборе.Только после нажатия кнопки.
спасибо заранее.
5 ответов
HTML:
<select name="myList" id="ddlMyList">
<option value="http://www.google.com">Google</option>
<option value="http://www.yahoo.com">Yahoo</option>
<option value="http://www.ask.com">Ask</option>
</select>
<input type="button" value="Go To Site!" onclick="NavigateToSite()" />
JavaScript:
function NavigateToSite(){
var ddl = document.getElementById("ddlMyList");
var selectedVal = ddl.options[ddl.selectedIndex].value;
window.location = selectedVal;
}
вы также можете открыть сайт в новом окне, делаю так:
function NavigateToSite(){
var ddl = document.getElementById("ddlMyList");
var selectedVal = ddl.options[ddl.selectedIndex].value;
window.open(selectedVal)
}
в качестве примечания, ваши теги опций неправильно отформатированы. Вы никогда не должны использовать <...> ярлык, когда тег содержит содержимое.
во-первых, измените значения параметров на URL-адрес, который вы хотите настроить:
<option value="http://www.google.com">Google</option>
<option value="http://www.yahoo.com">Yahoo</option>
<option value="http://www.ask.com">Ask</option>
затем добавьте идентификатор в select, чтобы вы могли его настроить:
<select name="myList" id="myList">
наконец, добавьте метод onclick в элемент управления select для обработки перенаправления:
<input type="button" onclick="document.location.href=document.getElementById('myList').value">
<select name="myList">
<option value="http://www.google.com">Google</option>
<option value="http://www.yahoo.com">Yahoo</option>
<option value="http://www.ask.com">Ask</option>
</select>
<input type="button" onclick="window.location=document.myList.value" />
используя JavaScript, вы можете прикрепить onclick
событие к кнопке. В обработчике событий можно использовать if
заявление, чтобы проверить, какое значение было выбрано в select
список, и использовать window.location
для перенаправления пользователя на соответствующий URL-адрес.
Я бы предложил изменить value
на option
элементы должны быть требуемым URL-адресом, и вы можете просто захватить значение и перейти к этому URL-адресу, вместо того, чтобы проверять, какой параметр был выбран.