<html>
<head>
</head>
// how to make them checked all question ??
<form method="post" action="data.php">
<table>
<tr>
<td><label> I am a high achiever. </label></td>
<td><input type="radio" name="Dquestion[1]" value="1"> 1 </td>
<td><input type="radio" name="Dquestion[1]" value="2"> 2 </td>
<td><input type="radio" name="Dquestion[1]" value="3"> 3 </td>
<td><input type="radio" name="Dquestion[1]" value="4"> 4 </td>
<td><input type="radio" name="Dquestion[1]" value="5"> 5 </td>
<td><input type="radio" name="Dquestion[1]" value="6"> 6 </td>
<td><input type="radio" name="Dquestion[1]" value="7"> 7 </td>
<td><input type="radio" name="Dquestion[1]" value="8"> 8 </td>
<td><input type="radio" name="Dquestion[1]" value="9"> 9 </td>
<td><input type="radio" name="Dquestion[1]" value="10"> 10 </td>
</tr><!-- 11 -->
<td>question2</td>
<td><input type="radio" name="I1" value="1"> 1 </td>
<td><input type="radio" name="Iquestion[1]" value="2"> 2 </td>
<td><input type="radio" name="Iquestion[1]" value="3"> 3 </td>
<td><input type="radio" name="Iquestion[1]" value="4"> 4 </td>
<td><input type="radio" name="Iquestion[1]" value="5"> 5 </td>
<td><input type="radio" name="Iquestion[1]" value="6"> 6 </td>
<td><input type="radio" name="Iquestion[1]" value="7"> 7 </td>
<td><input type="radio" name="Iquestion[1]" value="8"> 8 </td>
<td><input type="radio" name="Iquestion[1]" value="9"> 9 </td>
<td><input type="radio" name="Iquestion[1]" value="10"> 10 </td>
</tr>
<tr>
<td>question3</td>
<td><input type="radio" name="H1" value="1"> 1 </td>
<td><input type="radio" name="Hquestion[1]" value="2"> 2 </td>
<td><input type="radio" name="Hquestion[1]" value="3"> 3 </td>
<td><input type="radio" name="Hquestion[1]" value="4"> 4 </td>
<td><input type="radio" name="Hquestion[1]" value="5"> 5 </td>
<td><input type="radio" name="Hquestion[1]" value="6"> 6 </td>
<td><input type="radio" name="Hquestion[1]" value="7"> 7 </td>
<td><input type="radio" name="Hquestion[1]" value="8"> 8 </td>
<td><input type="radio" name="Hquestion[1]" value="9"> 9 </td>
<td><input type="radio" name="Hquestion[1]" value="10"> 10 </td>
</tr>
<tr>
<td><label> question4 </label></td>
<td><input type="radio" name="Aquestion[1]" value="1"> 1 </td>
<td><input type="radio" name="Aquestion[1]" value="2"> 2 </td>
<td><input type="radio" name="Aquestion[1]" value="3"> 3 </td>
<td><input type="radio" name="Aquestion[1]" value="4"> 4 </td>
<td><input type="radio" name="Aquestion[1]" value="5"> 5 </td>
<td><input type="radio" name="Aquestion[1]" value="6"> 6 </td>
<td><input type="radio" name="Aquestion[1]" value="7"> 7 </td>
<td><input type="radio" name="Aquestion[1]" value="8"> 8 </td>
<td><input type="radio" name="Aquestion[1]" value="9"> 9 </td>
<td><input type="radio" name="Aquestion[1]" value="10"> 10 </td>
</tr><!-- 14 -->
<tr>
<td><label> I am strong willed. </label></td>
<td><input type="radio" name="Dquestion[2]" value="1"> 1 </td>
<td><input type="radio" name="Dquestion[2]" value="2"> 2 </td>
<td><input type="radio" name="Dquestion[2]" value="3"> 3 </td>
<td><input type="radio" name="Dquestion[2]" value="4"> 4 </td>
<td><input type="radio" name="Dquestion[2]" value="5"> 5 </td>
<td><input type="radio" name="Dquestion[2]" value="6"> 6 </td>
<td><input type="radio" name="Dquestion[2]" value="7"> 7 </td>
<td><input type="radio" name="Dquestion[2]" value="8"> 8 </td>
<td><input type="radio" name="Dquestion[2]" value="9"> 9 </td>
<td><input type="radio" name="Dquestion[2]" value="10"> 10 </td>
</tr><!-- 15 -->
<tr>
<td colspan=2>
<div align="center"><input type="submit" name="submit" value="Score my test"></div>
</td>
</tr>
</table>
</form>
</html>
我想确保用户单击所有问题,我将如何做到这一点? 我希望他们回答所有问题,如果他们没有回答所有问题并单击提交按钮,它不会 work.do 我如何使用 PHP 或 JavaScript 来做到这一点?
首先,请确保您的输入字段是一致的。 例如,问题 2 的第一个输入字段的名称为 I1
,而下一个输入字段的名称为 Iquestion[1]
。确保它们具有相同的结构,你会得到这样的想法:
<form method="post" action="data.php" id="answerswerForm">
<table>
<tr>
<td><label> I am a high achiever. </label></td>
<td><input type="radio" name="Dquestion[1]" value="1"> 1 </td>
<td><input type="radio" name="Dquestion[1]" value="2"> 2 </td>
<td><input type="radio" name="Dquestion[1]" value="3"> 3 </td>
<td><input type="radio" name="Dquestion[1]" value="4"> 4 </td>
<td><input type="radio" name="Dquestion[1]" value="5"> 5 </td>
<td><input type="radio" name="Dquestion[1]" value="6"> 6 </td>
<td><input type="radio" name="Dquestion[1]" value="7"> 7 </td>
<td><input type="radio" name="Dquestion[1]" value="8"> 8 </td>
<td><input type="radio" name="Dquestion[1]" value="9"> 9 </td>
<td><input type="radio" name="Dquestion[1]" value="10"> 10 </td>
</tr><!-- 11 -->
<td>question2</td>
<td><input type="radio" name="Iquestion[1]" value="1"> 1 </td>
<td><input type="radio" name="Iquestion[1]" value="2"> 2 </td>
<td><input type="radio" name="Iquestion[1]" value="3"> 3 </td>
<td><input type="radio" name="Iquestion[1]" value="4"> 4 </td>
<td><input type="radio" name="Iquestion[1]" value="5"> 5 </td>
<td><input type="radio" name="Iquestion[1]" value="6"> 6 </td>
<td><input type="radio" name="Iquestion[1]" value="7"> 7 </td>
<td><input type="radio" name="Iquestion[1]" value="8"> 8 </td>
<td><input type="radio" name="Iquestion[1]" value="9"> 9 </td>
<td><input type="radio" name="Iquestion[1]" value="10"> 10 </td>
</tr>
<tr>
<td>question3</td>
<td><input type="radio" name="Hquestion[1]" value="1"> 1 </td>
<td><input type="radio" name="Hquestion[1]" value="2"> 2 </td>
<td><input type="radio" name="Hquestion[1]" value="3"> 3 </td>
<td><input type="radio" name="Hquestion[1]" value="4"> 4 </td>
<td><input type="radio" name="Hquestion[1]" value="5"> 5 </td>
<td><input type="radio" name="Hquestion[1]" value="6"> 6 </td>
<td><input type="radio" name="Hquestion[1]" value="7"> 7 </td>
<td><input type="radio" name="Hquestion[1]" value="8"> 8 </td>
<td><input type="radio" name="Hquestion[1]" value="9"> 9 </td>
<td><input type="radio" name="Hquestion[1]" value="10"> 10 </td>
</tr>
<tr>
<td><label> question4 </label></td>
<td><input type="radio" name="Aquestion[1]" value="1"> 1 </td>
<td><input type="radio" name="Aquestion[1]" value="2"> 2 </td>
<td><input type="radio" name="Aquestion[1]" value="3"> 3 </td>
<td><input type="radio" name="Aquestion[1]" value="4"> 4 </td>
<td><input type="radio" name="Aquestion[1]" value="5"> 5 </td>
<td><input type="radio" name="Aquestion[1]" value="6"> 6 </td>
<td><input type="radio" name="Aquestion[1]" value="7"> 7 </td>
<td><input type="radio" name="Aquestion[1]" value="8"> 8 </td>
<td><input type="radio" name="Aquestion[1]" value="9"> 9 </td>
<td><input type="radio" name="Aquestion[1]" value="10"> 10 </td>
</tr><!-- 14 -->
<tr>
<td><label> I am strong willed. </label></td>
<td><input type="radio" name="Dquestion[2]" value="1"> 1 </td>
<td><input type="radio" name="Dquestion[2]" value="2"> 2 </td>
<td><input type="radio" name="Dquestion[2]" value="3"> 3 </td>
<td><input type="radio" name="Dquestion[2]" value="4"> 4 </td>
<td><input type="radio" name="Dquestion[2]" value="5"> 5 </td>
<td><input type="radio" name="Dquestion[2]" value="6"> 6 </td>
<td><input type="radio" name="Dquestion[2]" value="7"> 7 </td>
<td><input type="radio" name="Dquestion[2]" value="8"> 8 </td>
<td><input type="radio" name="Dquestion[2]" value="9"> 9 </td>
<td><input type="radio" name="Dquestion[2]" value="10"> 10 </td>
</tr><!-- 15 -->
<tr>
<td colspan="2">
<div align="center"><input type="submit" name="submit" value="Score my test"></div>
</td>
</tr>
</table>
</form>
另请注意,我在表单中添加了一个id
。我们需要使用它来捕获submit
事件。对于事件处理,您可以使用 AJAX。在这里,您可以检查有多少种不同的无线电输入以及提交了多少种。有了这些知识,就可以比较这些值,并根据结果进行提交或显示alert
(或您想要的任何其他类型的消息(。要捕获submit
事件并确定后续操作,您可以使用如下所示的内容:
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script>
$(document).on('submit', '#answerForm',function(e)
{
var data = $(this).serializeArray();
var questions = new Array();
var questionsCounter = 0;
$.each($('input[type="radio"]'), function()
{
if(questions.indexOf($(this).attr('name')) == -1)
{
questions.push($(this).attr('name'));
questionsCounter++;
}
});
if(questionsCounter != data.length)
{
e.preventDefault();
alert("You did not answer all questions");
}
});
</script>
请注意,这是客户端的,不会保存,因为可以操作客户端脚本。您应该仅将其用于可用目的,并且如果所有答案都已填写,则还要在PHP脚本中创建检查。
Jquery,你可以只使用 JavaScript:
<td><input type="radio" onclick="q1 = true; func()" onselect="func()" name="Dquestion[1]" value="1"> 1 </td>
只需为每个单选按钮添加点击功能
<body onload = "go()">
加载正文时go
启动功能(这会将提交按钮设置为禁用(
<script type="text/javascript">
var q1 = false;
var q2 = false;
var q3 = false;
var q4 = false;
var q5 = false;
function go (){
document.getElementById("submit").disabled = true;
}
function func() {
if (q1 == true && q2 == true && q3 == true && q4 == true && q5 == true) {
document.getElementById("submit").disabled = false;
};
}
</script>
现在为每个问题添加一个变量,它检查是否所有"q"变量都为真,如果它们被提交将被启用
====
==================================编辑
你可以使用数组,你仍然需要说每个数组都是假的,那么你的脚本应该看起来像这样:
var q = [false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false, false];
var tru = 0;
function go (){
document.getElementById("submit").disabled = true;
}
function func() {
for (var i = 0; i < q.length; i++) {
if (q[i] == true) {
tru++;
if (tru == q.length) {
document.getElementById("submit").disabled = false;
};
};
};
}
现在,您只需要在该数组中输入 false 的次数,只要您有问题,单选按钮如下所示
<td><input type="radio" onclick="q[0] = true; func()" name="Dquestion[1]" value="1"> 1 </td>
onclick="q[0] = true; func()"
q
的索引是题号-1,所以题1的索引是0,等等...
====
==================================编辑
您可以在 php 中检查单选按钮是否在 data.php
中选中,因为您的表单指向数据.php并在表单中发布所有值
if ($_POST['Dquestion[1]'] == null){
echo "<script language=javascript> window.location='quiz.html';</script>";
}在这里,您检查 Dquestion[1] 是否为空,如果是,它将重定向您到 quiz.html。不确定 PHP 是否完全正确,因为我现在无法检查它,因为我在工作中