javascript - PHP 表单 - 单击单选按钮提交表单

Question

我真的需要你在这个问题上帮助我。 我已经搜索过，但没有找到与上述主题相关的内容。

我有一个带有 2 个以上选项单选按钮和一个提交按钮的表单。 我使用 setTimeOut 脚本编写表单 --> 如果 15 秒内未采取任何操作，页面应自行提交。 ...这有效!

我想添加的另一个条款是，单击任何单选按钮时，表单应自动提交。这是因为，我想放弃提交按钮。

因此，SetTimeOut 函数仍然保留，并使用 onClick 事件自动提交。

我的定时器功能是这样的:

<script type="text/javascript">
var mins;
var secs;
function cd() {
mins = 1 * m("01"); // change minutes here
secs = 0 + s(":00"); // change seconds here (always add an additional second to your total)
redo();
}
function m(obj) {
for(var i = 0; i < obj.length; i++) {
if(obj.substring(i, i + 1) == ":")
break;
}
return(obj.substring(0, i));
}
function s(obj) {
for(var i = 0; i < obj.length; i++) {
if(obj.substring(i, i + 1) == ":")
break;
}
return(obj.substring(i + 1, obj.length));
}
function dis(mins,secs) {
var disp;
if(mins <= 9) {
disp = " 0";
} else {
disp = " ";
}
disp += mins + ":";
if(secs <= 9) {
disp += "0" + secs;
} else {
disp += secs;
}
return(disp);
}

function redo() {
secs--;
if(secs == -1) {
secs = 15;
mins--;
}
//document.getElementById(txt.innerHTML) = dis(mins,secs);
document.cd.disp.value = dis(mins,secs); // setup additional displays here.
if((mins == 0) && (secs == 0)) {
//window.alert("Time is up. Press OK to continue."); // change timeout message as required
document.getElementById('form2').submit();
window.location = "testResult.php" // redirects to specified page once timer ends and ok button is pressed
} else {
cd = setTimeout("redo()",1000);
}
}

function init() {
cd();
}
window.onload = init; 

//页面加载时，时间在表单 (CD) 的文本框 (disp) 中显示倒计时

单选按钮的代码如下:

<form id="form2" name="form2" method="post" action="testResult.php?Id=<?php echo $SID;?>&QuizId=<?php echo $qId;?>">
<table width="60%" border="0" cellpadding="0" cellspacing="0" align="center">

<?php
 $q=$Question;
$qid = '<input type="hidden" name="qid" id="qid" value="'.$Id.'" />';//question Id
$atsh='<input type="hidden" name="ats" id="ats" value="'.$atsid.'" />';//subject Id
//$quizh='<input type="hidden" name="quiz" id="quiz" value="'.$Quiz.'" />';//quiz Id
$qh='<input type="hidden" name="quest" id="quest" value="'.$Question.'" />';//get the question
$ah='<input type="hidden" name="ans" id="ans" value="'.$Answer.'" />'; //get the correct answer
$qA='<input type="radio" name="RadioGroup'.$i.'" value="'.$OptionA.'" id="OptionA" />'.$OptionA;//get the choices
$qB='<input type="radio" name="RadioGroup'.$i.'" value="'.$OptionB.'" id="OptionB" />'.$OptionB;
$qC='<input type="radio" name="RadioGroup'.$i.'" value="'.$OptionC.'" id="OptionC" />'.$OptionC;
$qD='<input type="radio" name="RadioGroup'.$i.'" value="'.$OptionD.'" id="OptionD" />'.$OptionD;


echo '<tr><td height="36" colspan="2" bgcolor="#85A157">
<span class="style1">Q.'.$Id.') '.$q.'</span>'.$qh.$ah.$atsh.$qid.'</td></tr>';
    echo '<tr><td  colspan="2">

<table width="100%" height="64" border="2" cellpadding="0" cellspacing="0" bordercolor="#A6BF79">';

echo '<tr><td height="32" width="50%">'.$qA.'</td>';
echo '<td width="50%">'.$qC.'</td></tr>';
echo '<tr><td height="32" width="50%">'.$qB.'</td>';
echo '<td width="50%">'.$qD.'</td></tr>';
?>

<input type="submit" name="button" id="button" value="Submit" />

面临的挑战是，我不知道如何让表单在用户单击任何单选按钮时自行提交。

Answer 1

只需向您的 radio 添加 onchange 属性即可:

$qA='<input type="radio" onchange="this.form.submit();" name="RadioGroup'.$i.'" value="'.$OptionA.'" id="OptionA" />'.$OptionA;//get the choices
$qB='<input type="radio" onchange="this.form.submit();" name="RadioGroup'.$i.'" value="'.$OptionB.'" id="OptionB" />'.$OptionB;
$qC='<input type="radio" onchange="this.form.submit();" name="RadioGroup'.$i.'" value="'.$OptionC.'" id="OptionC" />'.$OptionC;
$qD='<input type="radio" onchange="this.form.submit();" name="RadioGroup'.$i.'" value="'.$OptionD.'" id="OptionD" />'.$OptionD;

并且不需要jquery，所有表单元素都可以通过this.form引用其父表单