लोड हो रहा है...
HTML Select
पहले textarea मुक्त बहुपंक्ति पाठ था। select अलग काम है: निश्चित सूची से एक उत्तर चुनना — मुक्त टाइपिंग नहीं।
select क्यों है
शिपिंग, भोजन और सेटिंग्स को बंद सेट चाहिए। बेतरतीब टाइप डेटा बिगाड़ता है; सूची से teh चुनना नहीं। select नियंत्रण है; हर option एक विकल्प। select पर label और name अभी भी।
सीधा उत्तर
1) option वाला select। 2) label जोड़ें। 3) name select पर; value option पर। 4) वैकल्पिक खाली विकल्प, selected, disabled, optgroup। 5) सूची चयन — textarea पैराग्राफ नहीं।
📊 Select pieces beginners use
| Piece | Role | Beginner tip |
|---|---|---|
| select | Choice container | Owns name= for the submitted field key |
| option | One choice | value= is what posts; text is what users see |
| optgroup | Section header | Groups options; not itself submitted |
| name (on select) | Submit key | Required if the choice should post |
| id (on select) | Label hook | Match label for= |
| value (on option) | Submitted token | Prefer short stable codes (teh, salad) |
| selected | Default pick | At most one in a single-select list |
| disabled (option) | Unavailable | Shown but not choosable |
शिपिंग: शहर select
डिलीवरी नोट एक-पंक्ति input; शहर select। पहले खाली Choose। teh/isf कोड भेजें।
<form action="/ship" method="post">
<label for="city">City</label>
<select id="city" name="city" required>
<option value="">Choose…</option>
<option value="teh">Tehran</option>
<option value="isf">Isfahan</option>
<option value="shir">Shiraz</option>
</select>
<label for="note">Delivery note</label>
<input id="note" name="note" type="text" placeholder="Gate code, floor…">
<button type="submit">Continue</button>
</form>
शहर डेमो पढ़ें
- सूची नियंत्रण select है, textarea नहीं
- id label for से मिलता है
- name सबमिट कुंजी है
- हर option का छोटा value
- खाली value आकस्मिक डिफ़ॉल्ट रोकता है
- required असली शहर तक
- नोट एक-पंक्ति input
optgroup से भोजन
दूसरा डेमो Veg/Other। selected डिफ़ॉल्ट; disabled अनुपलब्ध।
<label for="meal">Meal</label>
<select id="meal" name="meal">
<optgroup label="Veg">
<option value="salad">Salad</option>
<option value="soup" selected>Soup</option>
</optgroup>
<optgroup label="Other">
<option value="stew">Stew</option>
<option value="grill" disabled>Grill (sold out)</option>
</optgroup>
</select>
भोजन डेमो पढ़ें
- optgroup खंड शीर्षक; सबमिट नहीं
- value चुने option से
- Soup पर selected
- Grill पर disabled
- label और name
- अगला: टाइपिंग वाले सुझाव के लिए datalist
select बनाम textarea बनाम input
- ज्ञात सूची: select
- मुक्त पैराग्राफ: textarea
- छोटी पंक्ति: input
- name select पर; value option पर
- हमेशा label
- सूची textarea में न लिखें
अभ्यास — बनाएँ और समूह करें
- चौथा शहर छोटा value
- Choose बदलें; value खाली रखें
- required हटाकर वापस
- Soup समूह बदलें
- Grill disabled आज़माएँ
- वाक्य: select value भेजता है; textarea मुक्त पाठ
- टाइप सुझाव अगले datalist में
आसान गलतियाँ
- कोड चाहते हुए value न होना
- select पर name भूलना
- बिना label
- विकल्प textarea में
- बिना optgroup लंबी सूची
- हर option पर name
- datalist से भ्रम
सार
- select + option = सूची से चुनना
- select पर label और name
- option का value सबमिट
- वैकल्पिक prompt, selected, disabled, optgroup
- मुक्त बहुपंक्ति नहीं
- अगला: datalist
🧠 अपने ज्ञान की परीक्षा करें
शुरू करने के लिए तैयार
अपने ज्ञान की परीक्षा करें
इस इंटरैक्टिव क्विज़ के साथ अपनी चुनौती लें और देखें कि आप विषय को कितनी अच्छी तरह समझते हैं
5
प्रश्न
70%
पास करने के लिए
∞
समय
∞
प्रयास
📝 निर्देश
- हर प्रश्न को ध्यान से पढ़ें
- हर प्रश्न के लिए सबसे अच्छा उत्तर चुनें
- आप जितनी बार चाहें क्विज़ दोबारा दे सकते हैं
- आपकी प्रगति शीर्ष पर दिखाई जाएगी