构建一个简单的测验

不久前我需要为一个客户构建一个测验。几个选择题，提交按钮，它会对测验进行评分并告诉你你的成绩。它有点傻乎乎的，并且是非常简单的 PHP，但我认为它可能是某些人的一个好的入门教程，以及在 HTML 中构建表单和使用 PHP 在另一个页面上处理数据的基本理论的一个很好的入门介绍。

 

查看演示   下载文件

 

测验的问题被包裹在一个表单中

<form action="grade.php" method="post" id="quiz">
   ... questions here ...
</form>

表单通常有提交按钮，这个也不例外。当点击提交按钮时，它会将表单中每个输入的数据“POST”到提供的“action”URL。

测验本质上是问题的列表，所以有序列表就可以，所以单个问题看起来像这样

<li>

    <h3>CSS Stands for...</h3>
    
    <div>
        <input type="radio" name="question-1-answers" id="question-1-answers-A" value="A" />
        <label for="question-1-answers-A">A) Computer Styled Sections </label>
    </div>
    
    <div>
        <input type="radio" name="question-1-answers" id="question-1-answers-B" value="B" />
        <label for="question-1-answers-B">B) Cascading Style Sheets</label>
    </div>
    
    <div>
        <input type="radio" name="question-1-answers" id="question-1-answers-C" value="C" />
        <label for="question-1-answers-C">C) Crazy Solid Shapes</label>
    </div>
    
    <div>
        <input type="radio" name="question-1-answers" id="question-1-answers-D" value="D" />
        <label for="question-1-answers-D">D) None of the above</label>
    </div>

</li>

请注意，那里有四个输入，但它们都具有“radio”类型和相同的“name”属性。它们基本上以这种方式充当单个输入，因为一次只能选择其中一个，并且数据作为单个值进行 POST。

最后，我们的提交按钮

<input type="submit" value="Submit Quiz" />

在我们的 grade.php 文件中，我们需要获取已 POST 的值，然后检查每个值并增加一个正确的数字，最后显示一个 div 显示正确答案的数量

<?php
    
    $answer1 = $_POST['question-1-answers'];
    $answer2 = $_POST['question-2-answers'];
    $answer3 = $_POST['question-3-answers'];
    $answer4 = $_POST['question-4-answers'];
    $answer5 = $_POST['question-5-answers'];

    $totalCorrect = 0;
    
    if ($answer1 == "B") { $totalCorrect++; }
    if ($answer2 == "A") { $totalCorrect++; }
    if ($answer3 == "C") { $totalCorrect++; }
    if ($answer4 == "D") { $totalCorrect++; }
    if ($answer5) { $totalCorrect++; }
    
    echo "<div id='results'>$totalCorrect / 5 correct</div>";
    
?>