Checkbox ir neaizstājams elements tīmekļa veidlapās, īpaši kad iziet runa par lietotājiem piedāvājamās izvēles iespējamu aktivizēšanu, piemēram, piekrītot vispārējiem lietošanas noteikumiem vai abonējot jaunumus. Šajā rokasgrāmatā es aplūkoju checkboxes pamatprasmes, izskaidroju to darbību un sniedzu soli pa solim norādījumus, kā izmantot checkboxes savās formās.
Checkboxes ne tikai ļauj vienkāršas Jā/Nē izvēles, bet tās arī var noderēt, ja tās tiek izmantotas kopā ar citiem veidlapas kontroles elementiem. Šī rokasgrāmata sniedz tev nepieciešamo zināšanu, lai pareizi implementētu un izmantotu checkboxes.
Svarīgākās atziņas
- Checkboxes ir ideāli rīki bināro lēmumu pieņemšanai veidlapās.
- Ja checkbox nav atzīmēts, tas netiks nosūtīts.
- Neatzīmētas checkbox noklusējuma vērtība tiek uzskatīta par tukšu.
- Tu vari noklusējuma kārtībā aktivizēt checkboxes, izmantojot atribūtu 'checked'.
- Checkboxes darbības principu izpratne ir būtiska veidlapu datu pareizai apstrādei.
Soli pa solim instrukcijas
Sol 1: Checkboxes izveide
Sāc, izveidojot savas checkboxes HTML formā. Tev būs nepieciešams atribūts type="checkbox" un katram checkboxam jābūt name atribūtam, lai identificētu tā vērtību, kad forma tiek iesniegta.
Šajā piemērā mēs izveidojam divas checkboxes: viena, lai piekristu vispārējiem lietošanas noteikumiem, un otra, lai saņemtu jaunumus. Abas checkboxes tiek identificētas ar nosaukumiem "piekrītu LSN" un "saņemu jaunumus".
Sol 2: Formas iestatīšana
Iestatiet savu formu ar GET vai POST metodi. Šajā piemērā mēs izmantojam GET metodi, lai redzētu izvēli URL parametrā.
Šeit ir vienkāršs piemērs formas ar checkboxes. Pārliecinies, ka checkboxes ir iekļauti <form>-Tagā, lai dati tiktu pareizi apstrādāti.
Sol 3: Pārbaudiet iesniegtos datus
Iesniedz formu, neaktivizējot nevienu checkbox. Tu pamanīsi, ka URL nekas nav redzams.
Sol 4: Vērtību pievienošana checkboxes
Aktivizē pirmo checkbox un iesniedz formu atkārtoti. Tikai aktīvie checkboxi tiks parādīti iesniegtajos datos.
Tiks nosūtīta tikai tā checkbox, kas faktiski tika atlasīta. Šajā gadījumā tu redzēsi specifisku nosaukumu un vērtību par aktivizēto checkbox formu dati.
Sol 5: Noklusējuma vērtības definēšana
Lai noklusējuma kārtā aktivizētu checkbox, pievieno atribūtu checked attiecīgajai checkbox.
Izmantojot atribūtu checked, checkbox tiks jau aktivizēta, kad lapa tiek ielādēta. Tas ir noderīgi, ja vēlies, lai noteiktas opcijas būtu izvēlētas noklusējuma kārtā.
Sol 6: Lietotāja ievades apstrāde
Kad lietotājs iesniedz formas ievades datus, pārbaudi checkbox vērtības. Gaidi tikai atzīmēto rūtiņu nosaukumus iesniegtajos datos.
Svarīgi ir nodrošināt, ka tavs aizmugure darbmašīna (piemēram, serveris, piemēram, Node.js ar Express) var pienācīgi reaģēt uz tukšiem vai neesošiem laukiem.
Kopsavilkums
Šajā pamācībā tu esi iemācījies pamatus par izvēles rūtiņām tīmekļa veidlapās. Tagad tu zini, kā izveidot izvēles rūtiņas, sapratīsi to darbību un kā nodrošināt, ka dati tiek pareizi nosūtīti. Izvēles rūtiņas nodrošina vienkāršu veidu, kā iegūt lietotāja preferences un tās būtu jāņem vērā katrā tīmekļa veidlapā.
Bieži uzdotie jautājumi
Kāda ir atšķirība starp izvēles rūtiņām un radio pogām?Izvēles rūtiņas ļauj izvēlēties vairākas iespējas, savukārt radio pogām ļauj izvēlēties tikai vienu iespēju no daudzām.
Kāpēc, ja rūtiņa nav atzīmēta, tā neparādās URL parametros?Rūtiņai, kas nav atzīmēta, nav vērtības, un tāpēc tā netiek nosūtīta ar iesūtītajiem veidlapas datiem.
Kā standarta iestatīt rūtiņu uz "atlasīts"?Pievieno atribūtu checked savai HTML rūtiņai.
Vai varu vienlaicīgi aktivizēt vairākas rūtiņas?Jā, lietotāji var vienlaicīgi izvēlēties vairākas rūtiņas veidlapā.