Html 单击按钮转到不同的网址
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6387572/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Go to different url on clicking button
提问by Sangram Nandkhile
i need to create html code, in which if user selects an item from drop down list and click button then it will go to respective link.
我需要创建 html 代码,如果用户从下拉列表中选择一个项目并单击按钮,那么它将转到相应的链接。
<select name="myList">
<option value="Google" />Google
<option value="yahoo" />yahoo
<option value="Ask" />Ask
</select>
if user selects Google from drop down list and clicks button, then page should be redirected to www.google.comand if it selects yahoo and clicks button should go to www.yahoo.com
如果用户从下拉列表中选择 Google 并单击按钮,则页面应重定向到www.google.com,如果选择 yahoo 并单击按钮应转到www.yahoo.com
I would like to mention that I need The button in this scenario. I don't want to go respective site on drop down selection.Only after clicking the button.
我想提一下,在这种情况下我需要按钮。我不想在下拉选择中转到相应的站点。仅在单击按钮后。
Thank you in advance.
先感谢您。
回答by James Hill
HTML:
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:
JavaScript:
function NavigateToSite(){
var ddl = document.getElementById("ddlMyList");
var selectedVal = ddl.options[ddl.selectedIndex].value;
window.location = selectedVal;
}
You could also open the site in a new window by doing this:
您还可以通过执行以下操作在新窗口中打开该站点:
function NavigateToSite(){
var ddl = document.getElementById("ddlMyList");
var selectedVal = ddl.options[ddl.selectedIndex].value;
window.open(selectedVal)
}
As a side note, your option tags are not properly formatted. You should never use the <... /> shortcut when a tag contains content.
作为旁注,您的选项标签格式不正确。当标签包含内容时,永远不要使用 <... /> 快捷方式。
回答by George Cummins
First, change the option values to the URL you want to target:
首先,将选项值更改为您要定位的 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>
Next, add an ID to the select so you can target it:
接下来,向选择添加一个 ID,以便您可以定位它:
<select name="myList" id="myList">
Finally, add an onclick method to the select control to handle the redirect:
最后,在 select 控件中添加一个 onclick 方法来处理重定向:
<input type="button" onclick="document.location.href=document.getElementById('myList').value">
回答by Jivings
<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" />
回答by James Allardice
Using JavaScript, you can attach an onclick
event to the button. In the event handler, you can use an if
statement to check which value was selected in the select
list, and use window.location
to redirect the user to the appropriate URL.
使用 JavaScript,您可以将onclick
事件附加到按钮。在事件处理程序中,您可以使用if
语句来检查在select
列表中选择了哪个值,并用于window.location
将用户重定向到适当的 URL。
I would suggest changing the value
of the option
elements to be the required URL, and you can then simply grab the value and go to that URL, instead of having to check which option was selected.
我会建议改变value
了的option
元素是需要的URL,然后你可以简单地抓住价值,去那个网址,而不必检查被选择的选项。
回答by Pratish
onclick()="window.location.href='page.html'"