javascript 选择导航到 URL 上的单选按钮
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16043651/
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
Radio button on select navigation to URL
提问by Naidu
I am newbie to java script and trying to achieve the following and was looking for suggestions:
我是 java 脚本的新手，并试图实现以下目标并正在寻找建议：
Create two radio buttons and whenever we select on radio button it should navigate to some URL like in the below example XYZ.com or ABC.com
创建两个单选按钮，每当我们选择单选按钮时，它应该导航到一些 URL，如下例 XYZ.com 或 ABC.com
<html>
<table width="450">
<tr>
<td style="background-color:#FFFFFF;"><h4>Choose a Field</h4></td>
</tr>
</table></br>
<form action="../">
<fieldset>
<input type="RADIO" value="http://xyz.com" name="userChoice" id="navRadio01">
<label for="navRadio01">XYZ</label><br>
<input type="RADIO" value="http://abc.com" name="userChoice" id="navRadio02" checked>
<label for="navRadio02">ABC</label><br>
<input type="BUTTON" value="Go" onclick="ob=this.form.userChoice;for(i=0;i<ob.length;i++){
if(ob[i].checked){window.open(ob[i].value,'_self');};}" style="color:#FFFFF;background-color:#E0E0E5;font-family:verdana;border-style:solid;" />
</fieldset>
</form>
</html>
I have used the Go button in the above example how can we do this, without using the Go button and once selected navigate to that link.?
我在上面的例子中使用了 Go 按钮，我们如何才能做到这一点，而不使用 Go 按钮，一旦选择导航到该链接。？
Please advice.
请指教。
Thank you all in advance.
谢谢大家。
- V
- V
采纳答案by WheretheresaWill
Have a look here:
看看这里：
Calling onclick on a radiobutton list using javascript
使用 javascript 在单选按钮列表上调用 onclick
There's a bit of a debate and then a full example at the bottom.
有一些争论，然后是底部的完整示例。
回答by rgamber
You can do it using the "onclick" event handler for radio buttons, like this:
您可以使用单选按钮的“onclick”事件处理程序来完成，如下所示：
<input type="RADIO" value="http://abc.com" onclick="window.open(this.value)" name="userChoice" id="navRadio02" checked>
Please note that as stated in the comments to your question, anchor tags are better suited to do this.
请注意，如对您的问题的评论所述，锚标签更适合执行此操作。
回答by Frank Tudor
Try this example:
试试这个例子：
<html>
<table width="450">
<tr>
<td style="background-color:#FFFFFF;"><h4>Choose a Field</h4></td>
</tr>
</table></br>
<form action="../">
<fieldset>
<input type="RADIO" name="userChoice" id="navRadio01" onclick="window.location='http://google.com'">
<input type="RADIO" name="userChoice" id="navRadio02" onclick="window.location='http://yahoo.com.com'">
</fieldset>
</form>
</html>
Hope it helps...
希望能帮助到你...
回答by johanson
<html>
<table width="450">
<tr>
<td style="background-color:#FFFFFF;"><h4>Choose a Field</h4></td>
</tr>
</table></br>
<form action="../">
<fieldset>
<input type="RADIO" name="userChoice" id="navRadio01" onclick="window.location='http://google.com'">
<input type="RADIO" name="userChoice" id="navRadio02" onclick="window.location='http://yahoo.com.com'">
</fieldset>
</form>
</html>回答by KernelPanik
You can pass a reference of the radio button to a function triggered by the radio button's onclick event. Then within the function, you open the link specified by the radio button's value.
您可以将单选按钮的引用传递给由单选按钮的 onclick 事件触发的函数。然后在函数内，打开由单选按钮的值指定的链接。
For example, function openLinkopens a link based upon the radio button's value.
例如，函数openLink根据单选按钮的值打开一个链接。
<script>
function openLink(radio){
window.open(radio.value,'_self');
}
</script>
Then in the body of the HTML page, you pass a reference to the radio button when it is clicked, to function openLink:
然后在 HTML 页面的正文中，在单击单选按钮时传递对单选按钮的引用，以发挥作用openLink：
<fieldset>
<input type="radio" id="fname" value="http://www.abc.com" name="name1" onclick="openLink(this)">
<input type="radio" value="http://www.xyz.com" id="fname2" name="name1" onclick="openLink(this)">
</fieldset>
