使用来自@amenadiel 的解决方案,其中使用 PHP JSON 数据生成了几个问题列表,您可以在线查看演示。
<?php
session_start();
$conn = mysqli_connect("localhost","root","","1_examen") or die("Connection failed".mysqli_connect_error());
$preguntas=[];
$sql = "SELECT * FROM Question";
$result = $conn->query($sql);
while($row = mysqli_fetch_assoc($result)) {
$preguntas[] = [
'name' => 'respuesta_'.$row["Id"],
'pregunta' => $row["Question"],
'alternativas' => [$row["A1"], $row["A2"],$row["A3"],$row["A4"]],
'respuesta' => null
];
}
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="assets/css/style.css">
<script src="https://a...content-available-to-author-only...s.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<!--
<input type="radio" name="q" id="q" value="Barry Sanders">
-->
<body>
<script type="text/javascript">
var preguntas = <?php echo json_encode($preguntas); ?>;
var pregunta_actual = 0;
</script>
<script type="text/javascript" src="assets/js/question.js"></script>
<script type="text/javascript">
$(function() {
$('#enviar').on('click', function() {
$('#formulario').submit();
});
});
</script>
<div id="container">
<div class="controles">
<a id="retroceder"> < retroceder </a>
<a id="avanzar"> avanzar > </a>
<a id="enviar"> enviar respuestas </a>
</div>
<hr>
<div class="container1">
<div id="tiempo_restante"></div>
<ul id="preguntas">
<!-- -->
</ul>
</div>
<!--<div class="respuestas"></div>-->
<form id="formulario" name="form" class="respuestas" method="POST" action="result.php">
<!---->
</form>
</div>
</body>
</html>
每个问题的每个选定答案都以这种方式保存数据:
<input type="radio" name="q" id="q" value="Barry Sanders">
使用来自@A.Cedano 的评论进行的测试
我正在使用ajax
通过消息发送给我的这段代码,我对这段代码很熟悉ajax
,我非常了解它的操作。
$(function() {
var frm = $('#formulario');
frm.submit(function(e){
e.preventDefault();
var formData = frm.serialize();
formData += '&' + $('#enviar').attr('name') + '=' + $('#enviar').attr('value');
var url = "result.php";
$.ajax({
type: frm.attr('method'),
url: url,
data: formData,
})
.done(function(data) {
let res = JSON.parse(data);
// si es true el estado
if(res.status){
$('.success').fadeIn();
$('.success').html(res.message).delay(3000).fadeOut(3000);
$(frm)[0].reset();
$(frm).hide();
} else {
// si es false el estado
//mensaje de error...
}
})
.fail(function() {
$('.fail').fadeIn();
$('.fail').html(textStatus).delay(3000).fadeOut(3000);
})
});
});
表单保持不变,我所做的唯一更改是删除action
表单,如下所示:
<form id="formulario" name="form" class="respuestas" method="POST">
在 result.php 文件中删除所有内容,以查看时间到期时发送是否正常。
只留下这个:
<?php
echo json_encode(['status'=> true, 'message'=>"Evaluación recibida"]);
?>
实际上,<div class="success"></div>
只要评估允许的时间到期,就会显示消息,与发送响应时的方式相同-> <a id="enviar"> enviar respuestas </a>
。
负责评估评估结果的代码如下:
结果.php
<?php
session_start();
$conn = mysqli_connect("localhost","root","admin","Examination") or die("Connection failed".mysqli_connect_error());
date_default_timezone_set("Asia/Kolkata");
$score = 0;
$results = $_SESSION["result"];
$name = $_SESSION["name"];
$answers = array();
setcookie("clock", "", time() - 3600);
for($i=0;$i<sizeof($results);$i++)
{
if($results[$i] == 1)
$score++;
}
$t=0;
$sql = "SELECT * FROM question";
$result = $conn->query($sql);
while($row = mysqli_fetch_assoc($result)){
$answers[$t] = $row["Answer"];
$t++;
}
$sql = "INSERT INTO user(Name,Score) values('$name',$score)";
$conn->query($sql);
?>
<table border="1px" id="table">
<tr><th>Question</th><th>Your Answer</th><th>Correct Answer</th><th>Points Scored</th></tr>
<?php
for($i=0;$i<10;$i++)
{
$temp = $i+1;
if($results[$i] == 0)
echo "<tr style='background-color: #FADBD8 ;'>";
else
echo "<tr style='background-color: #D5F5E3 ;'>";
echo "<td>".$temp."</td><td>".$_SESSION["answer"][$i]."</td><td>".$answers[$i]."</td><td>".$results[$i]."</td></tr>";
}
?>
</table>
它以这种方式生成并显示结果:
我的问题是我不明白如何显示评估结果,第二个问题是如何隐藏前面的过程,即在发送答案时隐藏评估/完成允许的评估时间。
也许同样ajax
可以通过以下方式隐藏信息:
if(res.status){
$('.success').fadeIn();
$('.success').html(res.message).delay(3000).fadeOut(3000);
$(frm)[0].reset();
$(frm).hide();
}
但是利用评估在同一页面上的事实,我可以利用相同的评估设计将正确的结果显示为绿色,将错误的答案显示为红色。
例如:
根据您之前的问题,我从回答中提出了相同的问题:
在 PHP 中,我写了一个很难的数组(您必须从查询中获取)
答案数组包含正确的替代项,因此您创建了一个删除该字段的问题数组(将其保留为空)。
在测试着陆时,您绘制一系列问题的内容。表格被发送到另一个平台,在那里将答案与正确的选项进行比较。
https://examples.ffflabs.com/test.php
我给你留下了代码要点:https ://gist.github.com/amenadiel/0e1193c36c1eaaa238955cf1e2e633c7
在不重新加载页面的情况下执行此操作
几乎一样,只是评估的脚本不再写 HTML 而是结果的 json。相同的问题登陆解析该结果并将 HTML 动态注入到表格中。
https://examples.ffflabs.com/ajax_test.php
https://gist.github.com/amenadiel/5624a99ebcd739542d5cc35b0f32a3b3
使用与问题相同的按钮面板显示结果并不难,但它涉及通过重新绘制框和右侧 div 的内容来复制初始流程。我认为答案中有足够的内容您可以自己做。
奖励曲目:
如果您想在选项中添加字母 (A)、B)、C) 等
您可以声明一个字母数组:
插入选项时:
您可以使用标签的样式以不显示半径,并为字母赋予不同的颜色以表示它是一个列表元素。总的来说,点击标签就相当于点击了输入,所以你对样式所做的任何事情都是无害的。
该字段
$_POST["submit"]
未在表单中定义(至少在您共享的代码中),因为没有具有该名称的元素。发生这种情况是因为您没有使用按钮发送信息,<input type="submit" name="submit" />
这是发布表单的最常见方式。一个小的解决方法是修改表单的代码,
#formulario
如下所示:您是否首先验证了您需要的查询是否正确?还带有脚本和警报();在查询中,您可以检查它是否这样输入查询。