Začiarkavacie políčko v Bootstrap - Príklady na implementáciu políčka Bootstrap

• Úvod do začiarkavacieho políčka v Bootstrap
• Začiarkavacie políčko Príklad 1
• Začiarkavacie políčko Príklad 2

Úvod do začiarkavacieho políčka v Bootstrap

Bootstrap používa veľa tlačidiel jedným kliknutím, ale niekedy musíme zvoliť jednu z možností. Výber možnosti má dva spôsoby, jedným je prepínač a druhým je začiarkavacie políčko. Prepínač má iba jednu možnosť na výber od ostatných. V každom prípade musíme vybrať viac ako jednu možnosť, ktorá je začiarkavacie políčko funkčné. Zaškrtávacie políčko má niekoľko možností na výber z mnohých možností. Zaškrtávacie políčko sa používa na výber možností vo viacerých výberoch kliknutím na začiarkavacie políčko. Použitie tlačidiel začiarkavacieho políčka predstavuje pri skúškach otázky s možnosťou výberu z viacerých odpovedí, keď otázka obsahuje viac odpovedí na jednu otázku. Bootstrap má vlastné tlačidlo začiarkavacieho políčka, uvidíte nižšie.

Príklady na implementáciu políčka Bootstrap

Používatelia môžu pochopiť, ako implementovať začiarkavacie políčko a fungovanie týchto tlačidiel. Nižšie sú uvedené príklady na implementáciu začiarkavacieho políčka v službe Boostrap:

1. Vertikálne začiarkavacie políčko
2. Začiarkavacie políčko

1. Vertikálne začiarkavacie políčko

Príklad vertikálneho začiarkavacieho políčka je uvedený v nasledujúcom texte.

kód:



Bootstrap Example vertical checkbox





Začiarkavacie políčko Príklad 1

Aké sú sedem divov v nasledujúcom zozname?

Taj Mahal

Egyptská pyramída

Londýnsky most

Eiffelova veža

Výkon:

Popis:

• Môžete vidieť vyššie uvedený príklad vertikálneho políčka. Toto je predvolené začiarkavacie políčko a nevyžaduje sa žiadna špeciálna trieda alebo entita.
• Každá entita formy prichádza vertikálne jedna po druhej.
• Toto sa väčšinou používa pri skúškach otázok s možnosťou výberu z viacerých odpovedí, aby ste zreteľne poznali možnosti a nezamieňali ich so začiarkavacím políčkom a štítkom. Každý používa triedu začiarkavacieho políčka so štítkom. Na otázku sa používa odseková entita

  ,

• Kliknutím na tlačidlo začiarknutia sa po kliknutí na tlačidlo začiarknutia začiarkne.

2. Začiarkavacie políčko

Príklad začiarkavacieho políčka je uvedený v nasledujúcom texte.

kód:



Bootstrap Example inline checkbox





Začiarkavacie políčko Príklad 2

záujmy:
maľba

tanec

čítanie

Výkon:

Popis:

• Vyššie uvedený príklad je vložené začiarkavacie políčko. Potrebujeme použiť triedu inline pre ostatné subjekty, ktoré majú formu inline.
• Pre začiarkavacie políčko inline sa vyžaduje začiarkavacie políčko inline, ktoré sa vyžaduje pri každom štítku.
• Ak chcete začiarkavacie políčko použiť v akejkoľvek podobe s inými vstupmi, je užitočné použiť aj začiatočné začiarkavacie políčko.
• Všetky začiarkavacie políčka sú v jednom riadku.
• Kliknutím na tlačidlo začiarknutia sa po kliknutí na tlačidlo začiarknutia začiarkne.

Zaškrtávacie políčko s použitím tlačidiel

Začiarkavacie políčko pri zavádzaní systému tiež s tlačidlami s niektorými triedami vyzeralo štýlovejšie a elegantnejšie. Trieda button-group-toggle, button button musí byť použitá v resp. V triede prepínania tlačidiel, skupín, prepínania dát = 'tlačidlá' je tiež potrebná forma. V poli musí byť začiarkavacie políčko pre prácu ako začiarkavacie políčko. Pozrime sa na príklady, pomocou ktorých sa dozviete viac o prepínaní pomocou začiarkavacieho políčka pomocou bootstrapu.

kód:



Bootstrap Example checkbox




Languages

HTML

CSS

JavaScript

Bootstrap




Výkon:

Popis:

• V tomto príklade sme použili primárne tlačidlo, ale na zaplatenie môžete použiť ktorékoľvek tlačidlo, ale ak chcete neukladať ďalšie údaje, musíte vypnúť automatické dopĺňanie.
• Ak užívateľ stlačí tlačidlo, automaticky sa vyberie ako možnosť a v prepínacom tlačidle si užívateľ môže zvoliť viac možností kliknutím na tlačidlá.
• Tu máme štyri možnosti na výber jazykov, používatelia si môžu zvoliť viac jazykov.
• class = 'btn-group-toggle' sa používa pre štýl zadávania formulára.
• Pretože tento prepínač údajov umožňuje JavaScript prepnúť na tlačidlá, aby bolo možné interpretovať aktívny a neaktívny režim.

Použitie aktívneho tlačidla začiarkavacieho políčka v Bootstrap

Ak užívateľská trieda pridá tlačidlo, potom je toto tlačidlo automaticky začiarknuté a užívatelia majú na výber zostávajúce možnosti. Toto tlačidlo zmení farbu na získanie aktivovaného znaku.

Pozrime sa na nasledujúci príklad:

kód:


Languages