单选按钮选择后无法重定向到页面

时间:2013-09-14 19:56:01

标签: javascript html radio-button

我有以下HTML来提供两个单选按钮选项。如果用户选择一个选项并单击“提交”,则会转到相应的页面。

<script src="js/jump.js"></script>

<form onsubmit="jump()">
<input type="radio" name="querytype" value="apple">Go to Apple page<br>
<input type="radio" name="querytype" value="orange">Go to Orange page<br>
<input type="submit" value="OK">
</form>

在JS文件jump.js中,我有以下功能:

function jump() {
    var selected = document.getElementsByName('querytype');

    for(var i=0; i<selected.length; i++) {
    var value = selected[i].value;
    if (selected[i].checked) {
        if (value === 'apple') {
        window.location.href = '/myapp/apple-page';
        } else {
        window.location.href = '/myapp/orange-page';
        }
    } 
    }
}

但这不起作用。当我做出选择并提交时,它不会转到“Apple”或“Orange”页面,但会显示空白页面。我该如何实现?

2 个答案:

答案 0 :(得分:1)

根据您的代码,我了解您只想根据用户选择重定向到Page X或Y. 如果是这种情况,则必须将“提交”按钮类型更改为“按钮” 像这样:

<input type="button" onclick="jump()" value="ok">

并从表单标记中删除属性onsubmit =“jump()”。

答案 1 :(得分:0)

return false放在jump()的末尾以阻止默认表单提交操作。