Untitled

 avatar
unknown
plain_text
14 days ago
1.5 kB
1
Indexable
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Simple Quiz</title>
  <style>
    body { font-family: Arial, sans-serif; margin: 20px; }
    .question { margin-bottom: 15px; }
    button { margin-top: 20px; }
  </style>
</head>
<body>
  <h1>Simple Quiz</h1>
  <form id="quizForm">
    <div class="question">
      <p>1. What is the capital of France?</p>
      <label><input type="radio" name="q1" value="Paris"> Paris</label><br>
      <label><input type="radio" name="q1" value="London"> London</label><br>
      <label><input type="radio" name="q1" value="Berlin"> Berlin</label>
    </div>
    <div class="question">
      <p>2. What is 5 + 3?</p>
      <label><input type="radio" name="q2" value="7"> 7</label><br>
      <label><input type="radio" name="q2" value="8"> 8</label><br>
      <label><input type="radio" name="q2" value="9"> 9</label>
    </div>
    <button type="button" onclick="checkAnswers()">Submit</button>
  </form>
  <p id="result"></p>
  <script>
    function checkAnswers() {
      const answers = { q1: "Paris", q2: "8" };
      let score = 0;
      const form = document.getElementById("quizForm");
      for (let question in answers) {
        const userAnswer = form[question].value;
        if (userAnswer === answers[question]) {
          score++;
        }
      }
      document.getElementById("result").textContent = `Your score: ${score}/2`;
    }
  </script>
</body>
</html>
Leave a Comment