HTML क्विज़

स्ट्रक्चरल क्विज़ सेटअप

एक HTML quiz बनाने के लिए, आप अपने सभी questions, selection fields, और submission buttons को साफ-सुथरे तरीके से एक साथ group करने के लिए अपने page पर एक standard form container define करते हैं।

उदाहरण: Structural Quiz Setup

<form action="/submit-quiz" method="post">
</form>

सिंगल-चॉइस क्वेश्चन्स

single-choice questions के लिए, आप grouped radio buttons इस्तेमाल करते हैं। अपने सभी radio button inputs को एक ही name attribute देकर, आप सुनिश्चित करते हैं कि users सिर्फ एक ही answer चुन सकें।

उदाहरण: Single-Choice Questions

<input type="radio" name="q1" value="a"> Paris
<input type="radio" name="q1" value="b"> London

मल्टी-चॉइस क्वेश्चन्स

उन multi-choice questions के लिए जहाँ users एक से ज़्यादा सही answer चुन सकते हैं, आप checkboxes इस्तेमाल करते हैं। हर checkbox स्वतंत्र रूप से काम करता है, जिससे users एक साथ कई selections toggle कर सकते हैं।

उदाहरण: Multi-Choice Questions

<input type="checkbox" name="q2" value="a"> HTML
<input type="checkbox" name="q2" value="b"> CSS

टेक्स्ट और लिखित उत्तर

आप अपने quizzes में standard text inputs या textareas इस्तेमाल करके लिखित questions भी शामिल कर सकते हैं। ये custom definitions, keywords, या short essays पर users को test करने के लिए बिल्कुल सही हैं।

उदाहरण: Text and Written Answers

<label for="q3">Define HTML:</label>
<textarea id="q3" name="q3"></textarea>

JavaScript से क्विज़ ग्रेड करना

अपने quiz को interactive बनाने के लिए, आप एक JavaScript function लिखते हैं जो user के form submit करने पर चलता है।

यह script default page reload को रोकता है, सभी selected input values capture करता है, उन्हें सही answers से चेक करता है, और तुरंत final score दिखाता है।

उदाहरण: Grading Quizzes with JavaScript

<form onsubmit="event.preventDefault(); console.log('Score calculated')">
  <input type="radio" name="q1" value="a"> Answer A
  <button type="submit">Submit Quiz</button>
</form>