Question

我需要创建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

我想提一下，我需要这个场景中的按钮。我不想在下拉选择中去相应的网站。只需点击按钮。

提前谢谢。

Answer 1

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)
}

作为旁注，您的选项标签格式不正确。你永远不应该使用＆lt; ... /＆gt;标签包含内容时的快捷方式。

Answer 2

首先，将选项值更改为您要定位的网址：

<option value="http://www.google.com">Google</option>
<option value="http://www.yahoo.com">Yahoo</option>
<option value="http://www.ask.com">Ask</option>

接下来，为选择添加ID，以便您可以定位它：

<select name="myList" id="myList">

最后，向select控件添加onclick方法以处理重定向：

<input type="button" onclick="document.location.href=document.getElementById('myList').value">

Answer 3

<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" />

Answer 4

使用JavaScript，您可以将onclick事件附加到按钮。在事件处理程序中，您可以使用if语句检查select列表中选择的值，并使用window.location将用户重定向到相应的URL。

我建议将value元素的option更改为必需的网址，然后您可以直接获取该值并转到该网址，而不必检查选择了哪个选项

Answer 5

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

点击按钮转到不同的URL

5 个答案: