Перейти к другому 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-адресу, вместо того, чтобы проверять, какой параметр был выбран.


onclick()="window.location.href='page.html'"