Hvordan vise tekst når avkrysningsruten er avmerket i JavaScript?

Grafalternativet er sjekket nå!

Linjealternativet er sjekket nå!

Her erklærer en funksjon som heter “CheckFunction ()”. I sin definisjon, bruk tilstanden på hver av avmerkingsboksene ved hjelp av "krysset av”Eiendom ved å få tilgang til ID -en deres direkte og på samme måte vise den tilsvarende meldingen også mot den hentede IDen til de tildelte avsnittene ved å bruke"vise”Eiendom:

Tilsvarende utgang vil være:

Fra utgangen kan det tydelig observeres at spesifikk tekst vises når en spesifikk avkrysningsrute er valgt.

Eksempel 2: Vis tekst når avkrysningsruten er avmerket i JavaScript ved hjelp av den avkryssede egenskapen med InterText -egenskapen
Denne egenskapen kan brukes for å få tilgang til de spesifiserte avmerkingsboksene og varsle brukeren om det sjekket alternativet på dokumentobjektsmodellen (DOM).

Eksempel

For det første inkluderer på samme måte følgende overskrift og avmerkingsbokser med de spesifiserte "id" og en "ved trykk”Hendelse som omdirigerer til avmerkingsboksen for funksjonen ():

Vis tekst når avkrysningsruten er merket av

Python


Java


JavaScript

Etter det, definer en funksjon som heter “avkrysningsrute ()”. Følgende funksjon i trinnet nedenfor vil hente ID -en for de spesifiserte avmerkingsboksene ved å bruke "dokument.getElementById ()”Metode.

Bruk også en sjekk på hver av avmerkingsboksene. For eksempel, hvis en bestemt avkrysningsrute er avmerket, vises den tilsvarende meldingen mot hver av avkrysningsruten på DOM via "Innertekst”Eiendom:

funksjon avkrysningsrute ()
get1 = dokument.getElementById ("Check1")
get2 = dokument.getElementById ("Check2")
get3 = dokument.getElementById ("Check3")
get4 = dokument.getElementById ("MSG")
if (get1.sjekket == true)
Get4.Innertext = "Python Language Selected"

ellers hvis (get2.sjekket == true)
Get4.Innertext = "Java Language Selected"

ellers hvis (get3.sjekket == true)
Get4.innertekst = "JavaScript -språk valgt"

Produksjon

Metode 2: Vis tekst når avkrysningsruten er avmerket i JavaScript ved hjelp av jQuery

Denne spesielle tilnærmingen kan være gjeldende ved å inkludere en "jQuery”Bibliotek og anvende metoder.

Eksempel 1: Vis tekst når avkrysningsruten sjekkes i JavaScript ved hjelp av jQuery IS () -metode
Denne metoden kan brukes for å anvende en betingelse på en av avmerkingsboksene og varsle brukeren deretter.

Det første trinnet vil være å inkludere “jQuery”Bibliotek:

Spesifiser nå avmerkingsboksene som refererer til tre forskjellige alternativer. En "ved trykk”Hendelsen er knyttet til hver av avkrysningsruten for å påkalle funksjonen CheckFunction () når du skal sjekke en bestemt avkrysningsrute:

Google


Linuxhint


YouTube

Til slutt, definere en funksjon som heter “CheckFunction ()”. Her, bruk en “Eller (||)" betingelse. Denne funksjonen vil utføre på en slik måte at så snart den spesifiserte avkrysningsruten er avmerket, vil en varslende dialogboks varsle brukeren om den. I det andre tilfellet, "ellers”Tilstand vil utføre:

funksjon checkFunction ()
if ($ ('#check1') || ('#check2') || ('#check3').er (': sjekket'))
Varsel ("en avkrysningsrute er avmerket");

annet
Varsel ("avkrysningsrute ikke avmerket");

Produksjon

Eksempel 2: Vis tekst når avkrysningsruten sjekkes i JavaScript ved hjelp av JQuery Ready () og klikk () -metoder
“klar()”Metode spesifiserer hva som skjer når en klar hendelse oppstår og dokumentobjektmodellen er lastet. "Klikk ()" -metoden, derimot, utløser funksjonen som skal kjøres når en klikkhendelse oppstår. Disse metodene kan implementeres for å klikke på den tilgjengelige avkrysningsruten og vise avkrysningsruten teksten og den tilsvarende verdien mot den.

Syntaks

$ (dokument).klar (funksjon)

I den gitte syntaksen, “funksjon”Refererer til funksjonen som skal utføres etter at DOM er lastet.

$ (velger).Klikk (funksjon)

Her, på samme måte, “funksjon”Peker på den spesifikke funksjonen som skal utføres når klikkhendelsen oppstår.

Gjennomføring
Inkluder først følgende jQuery -bibliotek:

Neste, innenfor “”Tag, spesifiser følgende etiketter og inngangstyper for hver av avmerkingsboksene:

Programmerings språk:

Python

JavaScript

Java

Etter det, oppretter du en knapp med den spesifiserte “klasse”Og“id”:

Få utfall

Nå, i jQuery -implementeringen, bruker du "klar() ”Metode slik at når DOM laster, blir de videre trinnene funksjonelle. I neste trinn, bruk "Klikk ()”Metode og hent avkrysningsrutene med deres spesifikke navn. “krysset av”Eiendom her vil sikre at avkrysningsruten er avkjørt og returnerer den tilsvarende verdien og teksten til den aktuelle avmerkingsboksen ved å bruke“val ()”Og“tekst()”Metoder henholdsvis:

$ (dokument).klar (funksjon ()
$ ('#utfall').klikk (funksjon ()
$ ('input [name = "utfall"]: sjekket').hver (funksjon ()
La verdi = $ (dette).val ();
La tekst = $ ('etikett [for = "$ verdi"]').tekst();
konsoll.Logg ('Verdien av avkrysningsruten er $ verdi');
konsoll.Logg ('Teksten til avkrysningsruten er $ text');
)
);
);

Produksjon

Denne oppskrivningen demonstrerte metodene som kan brukes til å vise tekst når en avkrysningsrute er avkjørt i JavaScript.

Konklusjon

For å vise tekst når en avkrysningsrute er avmerket i JavaScript, bruk "krysset av”Eiendom sammen med“vise”Eiendom for å vise den spesifiserte meldingen mot den tilsvarende avkrysningsruten som vil bli sjekket eller med“Innertekst“Eiendom for å vise den tilsvarende teksten på DOM så snart avkrysningsruten er merket av. Du kan også bruke jQuery -tilnærmingen med "er()”Metode for å bruke en“ELLER”Tilstandshåndtering av hver av avkrysningsruten eller“klar()”Og“Klikk ()”Metoder for å klikke på den hentet avkrysningsruten så snart DOM laster. Denne bloggen demonstrerte metodene for å vise tekst når en avkrysningsrute er merket av JavaScript.