Tento článek demonstruje účel, funkčnost a použití vlastnosti HTML DOM Input Radio „checked“ v JavaScriptu.
Co je vlastnost HTML DOM Input Radio „checked“ v JavaScriptu?
Vlastnost Input Radio „checked“ funguje na formulářích HTML a vstupních polích pro nastavení a kontrolu stavu tlačítka „Radio“.
Syntaxe (Nastavit zaškrtnutou vlastnost)
radioObject. kontrolovány = skutečný | NepravdivéPodle definované návratové syntaxe vlastnost „checked“ podporuje dva parametry, které jsou uvedeny níže:
- skutečný: Znamená to, že odpovídající prvek je zkontrolován.
- Nepravdivé: Označuje, že odpovídající prvek není zaškrtnutý.
Syntaxe (vrácení zkontrolované vlastnosti)
radioObject. kontrolovány Ve výše uvedené syntaxi je „ radioObject “ odkazuje na HTML “
Použijme výše definované syntaxe k vysvětlení použití vlastnosti HTML DOM Input Radio „checked“ pomocí uvedených praktických příkladů.
Příklad 1: Použití vlastnosti Input Radio „checked“. Použití základní syntaxe
V prvním příkladu je vytvořeno tlačítko „Radio“ pro nastavení vlastnosti „checked“ pomocí definované zobecněné syntaxe.
HTML kód
Nejprve se podívejte na uvedený HTML kód:
< styl těla = 'zarovnání textu: na střed' >
< h2 > HTML Vlastnost zkontrolovaná rádiem vstupu DOM h2 >
Barva : < Typ vstupu = 'rádio' id = 'žlutá' > Žlutá < br < br >
< tlačítko onclick = 'colorCheck()' > Šek 'žlutá' knoflík >
< tlačítko onclick = 'colorUncheck()' > Zrušte zaškrtnutí 'žlutá' knoflík >
Ve výše uvedených řádcích kódu:
- ' značka ” definuje část těla, která je zarovnána se značkou “ centrum “.
- ' značka ” určuje první podnadpis.
- '
Tag přidá tlačítko „Rádio“ zadáním typu vstupu „ rádio “s přiděleným ID” žlutá “. - '
Tag přidává jednoduché tlačítko spojené s „ při kliknutí ” událost k provedení “ colorCheck() ” funkce, která bude přístupná po kliknutí na tlačítko. - Podobně další „
tag vytvoří tlačítko pro vyvolání colorUncheck() ” funkce po kliknutí na tlačítko.
JavaScript kód
Dále postupujte podle daného kódu JavaScript:
< skript >funkce colorCheck ( ) {
dokument. getElementById ( 'žlutá' ) . kontrolovány = skutečný ;
}
barva funkceZrušte zaškrtnutí ( ) {
dokument. getElementById ( 'žlutá' ) . kontrolovány = Nepravdivé ;
}
skript >
Ve výše uvedeném úryvku kódu:
- První funkce' colorCheck() “ využívá „ document.getElementById() ” k načtení přepínacího tlačítka přiřaďte “ kontrolovány ” a nastavte její hodnotu na “true”.
- Na druhou stranu funkce „ colorUncheck() “ nastavuje hodnotu „ kontrolovány vlastnost ” na hodnotu false proti zvolenému přepínacímu tlačítku.
Výstup
Jak je vidět, výstup zkontroluje tlačítko „Rádio“ po kliknutí na tlačítko (pojmenované „Zkontrolovat“) a zruší zaškrtnutí“ při kliknutí na tlačítko („Zrušit zaškrtnutí“).
Příklad 2: Vrácení hodnoty „checked“ vstupního rádia
Tento příklad použije vlastnost Input Radio „checked“ k vrácení stavu cílového tlačítka „Radio“ jako booleovskou hodnotu.
HTML kód
Zvažte následující HTML kód:
< styl těla = 'zarovnání textu: na střed' >< h2 > HTML Vlastnost zkontrolovaná rádiem vstupu DOM h2 >
Barva : < Typ vstupu = 'rádio' kontrolovány = skutečný id = 'žlutá' > Žlutá < br < br >
< tlačítko onclick = 'colorCheck()' > Šek 'žlutá' knoflík >
< p id = 'vzorek' < p >
Ve výše uvedeném bloku kódu je „ Rádio vytvoří se tlačítko “ a stav “ kontrolovány “ vlastnost je nastavena na “ skutečný “. Poté je obdobně vyvolána uvedená funkce prostřednictvím připojeného „ při kliknutí ” událost pomocí tlačítka.
JavaScript kód
Nyní zvažte následující řádky kódu:
< skript >funkce colorCheck ( ) {
kde = dokument. getElementById ( 'žlutá' ) . defaultZkontrolováno ;
dokument. getElementById ( 'vzorek' ) . vnitřní HTML = t ;
}
skript >
Ve výše uvedeném úryvku kódu:
- Definujte funkci s názvem „ colorCheck() “.
- V jeho definici použijte „ document.getElementById() ” pro přístup k tlačítku „Rádio“ pomocí jeho id „žlutá“ a přiřazení „ defaultZkontrolováno vlastnost pro kontrolu výchozí hodnoty parametru kontrolovány ' atribut.
- Nakonec použijte „ document.getElementById() ” znovu načíst zahrnutý prázdný odstavec a zobrazit stav vlastnosti „checked“.
.
Výstup
Jak bylo analyzováno, výsledek vrací stav daného tlačítka „Rádio“, tj. skutečný “ po kliknutí na tlačítko.
Závěr
V JavaScriptu je vlastnost HTML DOM Input Radio „checked“ užitečná pro nastavení a vrácení zaškrtnutého stavu tlačítka „Radio“. Nastavená syntaxe vlastnosti „checked“ funguje na dvou hodnotách „ skutečný ' a ' Nepravdivé “. Na druhou stranu jeho návratová syntaxe nevyžaduje žádný parametr. Tento článek demonstroval cíl, funkčnost a použití vlastnosti HTML DOM Input Radio „checked“ v JavaScriptu.