根据所选选项从单选按钮通过'onclick'重定向到页面,而无需在php中“提交”表单

时间:2014-09-13 14:18:50

标签: javascript html forms

这是根据我的要求无效的代码

<head>

<script type="text/javascript">

function test(){

if(document.form.choice.value='pc'){

window.open('pc.php','_self');

return true;

}

else if(document.form.choice.value='ps2'){

window.open('ps2.php','_self');

return true;

}

else if(document.form.choice.value='ps3'){

window.open('ps3.php','_self');

return true;

}

else if(document.form.choice.value='psp'){

window.open('psp.php','_self');

return true;

}

}

</script>

</head>

<body>

Games<br /><br />

<form name="form">ALL &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

<input type="radio" onClick="test()" name="choice" value="pc">PC &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" onClick="test()" name="choice" value="ps2">PS2 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" onClick="test()" name="choice" value="ps3">PS3 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" onClick="test()" name="choice" value="psp">PSP &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</form>

</body>

此外,我想知道如何通过选择下拉列表中的选定字段而不显示“提交”来自动显示字段

<select name="genre">
        <option value="">--Select Genre and Click Go--</option>
        <option value="All">All</option>
        <option value="Action / Mission">Action / Mission</option>
        <option value="Arcade">Arcade</option>
        <option value="Racing">Racing</option>
        <option value="Sports">Sports</option>
        <option value="Kids">Kids</option>
        <option value="Strategy">Strategy</option>
        <option value="Adventure">Adventure</option>
      </select>

2 个答案:

答案 0 :(得分:1)

试试这个......

<强>编辑:

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"> </script>
<script type="text/javascript">
 function idForm(){
   var selectvalue = $('input[name=choice]:checked', '#idForm').val();


if(selectvalue == "pc"){
window.open('http://www.google.com','_self');
return true;
}
else if(selectvalue == "ps2"){
window.open('http://www.google.com','_self');
return true;
}else if(selectvalue == 'ps3'){
window.open('http://www.google.com','_self');
return true;
}else if(selectvalue == 'psp'){
window.open('http://www.google.com','_self');
return true;
}
return false;
};


</script>
</head>
<body>
Games<br /><br />
<form id="idForm">ALL &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio" onclick="idForm()"  name="choice" value="pc"/>PC &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio"  onclick="idForm()" name="choice" value="ps2"/>PS2 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio"  onclick="idForm()" name="choice" value="ps3"/>PS3 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="radio"  onclick="idForm()" name="choice" value="psp"/>PSP &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</form>
</body>

<强>的jsfiddle link

答案 1 :(得分:0)

您可以通过在onchange代码中添加<select>事件来获取该选项的价值。

<select name="genre" onchange="selectOption()">
            <option value="">--Select Genre and Click Go--</option>
            <option value="All">All</option>
            <option value="Action / Mission">Action / Mission</option>
            <option value="Arcade">Arcade</option>
            <option value="Racing">Racing</option>
            <option value="Sports">Sports</option>
            <option value="Kids">Kids</option>
            <option value="Strategy">Strategy</option>
            <option value="Adventure">Adventure</option>
          </select>

在您的脚本中添加此

function selectOption(){
//each option value
var option=document.form.genre.value;
alert(option);


}

要进行重定向,您可以在window.location方法中使用test() 使用此window.location=yourpage.php代替此window.open('pc.php','_self')