未选择单选按钮时显示警报[重复]

Question

我有以下代码：

<div id="page-wrap">

  <h1> Simple Quiz Built On PHP </h1>
  <form action="result.php" method="post" id="quiz">

    <ol>

      <li>

        <h3>WordPress is a...</h3>

        <div>
          <input type="radio" name="question-1-answers" id="question-1-answers-A" value="A" />
          <label for="question-1-answers-A">A) Software 
                        </label>
        </div>

        <div>
          <input type="radio" name="question-1-answers" id="question-1-answers-B" value="B" />
          <label for="question-1-answers-B">B) Web App</label>
        </div>

        <div>
          <input type="radio" name="question-1-answers" id="question-1-answers-C" value="C" />
          <label for="question-1-answers-C">C) CMS</label>
        </div>

        <div>
          <input type="radio" name="question-1-answers" id="question-1-answers-D" value="D" />
          <label for="question-1-answers-D">D) Other</label>
        </div>

      </li>

      <li>

        <h3>SEO is Part Of...</h3>

        <div>
          <input type="radio" name="question-2-answers" id="question-2-answers-A" value="A" />
          <label for="question-2-answers-A">A) Video Editing</label>
        </div>

        <div>
          <input type="radio" name="question-2-answers" id="question-2-answers-B" value="B" />
          <label for="question-2-answers-B">B) Graphic Designing</label>
        </div>

        <div>
          <input type="radio" name="question-2-answers" id="question-2-answers-C" value="C" />
          <label for="question-2-answers-C">C) Web Designing</label>
        </div>

        <div>
          <input type="radio" name="question-2-answers" id="question-2-answers-D" value="D" />
          <label for="question-2-answers-D">D) Digital Marketing</label>
        </div>

      </li>

      <li>

        <h3>PHP is a....</h3>

        <div>
          <input type="radio" name="question-3-answers" id="question-3-answers-A" value="A" />
          <label for="question-3-answers-A">A) Server Side Script</label>
        </div>

        <div>
          <input type="radio" name="question-3-answers" id="question-3-answers-B" value="B" />
          <label for="question-3-answers-B">B) Programming Language</label>
        </div>

        <div>
          <input type="radio" name="question-3-answers" id="question-3-answers-C" value="C" />
          <label for="question-3-answers-C">C) Markup Language</label>
        </div>

        <div>
          <input type="radio" name="question-3-answers" id="question-3-answers-D" value="D" />
          <label for="question-3-answers-D">D) None Of Above These</label>
        </div>

      </li>

      <li>

        <h3>Localhost IP is..</h3>

        <div>
          <input type="radio" name="question-4-answers" id="question-4-answers-A" value="A" />
          <label for="question-4-answers-A">A) 192.168.0.1</label>
        </div>

        <div>
          <input type="radio" name="question-4-answers" id="question-4-answers-B" value="B" />
          <label for="question-4-answers-B">B) 127.0.0.0</label>
        </div>

        <div>
          <input type="radio" name="question-4-answers" id="question-4-answers-C" value="C" />
          <label for="question-4-answers-C">C) 1080:80</label>
        </div>

        <div>
          <input type="radio" name="question-4-answers" id="question-4-answers-D" value="D" />
          <label for="question-4-answers-D">D) Any Other</label>
        </div>

      </li>

      <li>

        <h3>Webdevtrick Is For</h3>

        <div>
          <input type="radio" name="question-5-answers" id="question-5-answers-A" value="A" />
          <label for="question-5-answers-A">A) Web Designer</label>
        </div>

        <div>
          <input type="radio" name="question-5-answers" id="question-5-answers-B" value="B" />
          <label for="question-5-answers-B">B) Web Developer</label>
        </div>

        <div>
          <input type="radio" name="question-5-answers" id="question-5-answers-C" value="C" />
          <label for="question-5-answers-C">C) Graphic Designer</label>
        </div>

        <div>
          <input type="radio" name="question-5-answers" id="question-5-answers-D" value="D" />
          <label for="question-5-answers-D">D) All Above These</label>
        </div>

      </li>

    </ol>

    <input type="submit" value="Submit" class="submitbtn" />

  </form>

</div>

我的要求是用户必须回答所有问题，因为我有错误

“未定义的数组键”。

如果用户没有选择单选按钮，则会显示警报。 我在使用此代码时遇到问题，因为我是初学者。 这是result.php的代码

<div id="page-wrap">

  <h1>Result</h1>

  <?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 == "C") { $totalCorrect++; }
            if ($answer2 == "D") { $totalCorrect++; }
            if ($answer3 == "A") { $totalCorrect++; }
            if ($answer4 == "B") { $totalCorrect++; }
            if ($answer5 == "D") { $totalCorrect++; }
            
            echo "<div id='results'>$totalCorrect / 5 correct</div>";
            
        ?>

</div>

该应用程序是一个测验表格。当所有单选按钮都被选中时，它可以工作，但是当我错过答案时，我得到这个错误：在图片上。 在我看来，唯一的方法是显示是否所有单选按钮都被选中的警报消息，然后将表单发送到 result.php 数据库。

Answer 1

尝试将必需属性添加到组中的 一个 复选框。例如，第一个问题看起来像

<li>
            
                <h3>WordPress is a...</h3>
                
                <div>
                    <input type="radio" name="question-1-answers" id="question-1-answers-A" value="A" required />
                    <label for="question-1-answers-A">A) Software 
                    </label>
                </div>
                
                <div>
                    <input type="radio" name="question-1-answers" id="question-1-answers-B" value="B" />
                    <label for="question-1-answers-B">B) Web App</label>
                </div>
                
                <div>
                    <input type="radio" name="question-1-answers" id="question-1-answers-C" value="C" />
                    <label for="question-1-answers-C">C) CMS</label>
                </div>
                
                <div>
                    <input type="radio" name="question-1-answers" id="question-1-answers-D" value="D" />
                    <label for="question-1-answers-D">D) Other</label>
                </div>
            
            </li>

它将使浏览器验证用户在每个问题中至少检查了一个答案。