Jak wyświetlić tekst, gdy pole wyboru jest zaznaczone w JavaScript?

Opcja wykresu jest teraz sprawdzana!

Opcja linii jest teraz sprawdzana!

Tutaj zadeklaruj funkcję o nazwie „CheckFunction ()". W swojej definicji zastosuj warunek na każdym z pola wyboru za pomocą „sprawdzony”Właściwość, uzyskując dostęp do ich identyfikatora bezpośrednio i podobnie wyświetlaj odpowiednią wiadomość również w stosunku do pobieranego identyfikatora przypisanych akapitów za pomocą„wyświetlacz" nieruchomość:

Odpowiednie wyjście będzie:

Ze wyjścia można wyraźnie zaobserwować, że określony tekst jest wyświetlany po wybraniu określonego pola wyboru.

Przykład 2: Wyświetl tekst, gdy pole wyboru jest zaznaczone w JavaScript za pomocą właściwości odprawy z właściwością Innertext
Tę właściwość można zastosować, aby uzyskać dostęp do określonych pola wyboru i powiadomić użytkownika o sprawdzonej opcji w modelu obiektu Dokument (DOM).

Przykład

Po pierwsze, podobnie uwzględnij następujące pola nagłówka i pola wyboru z określonymi „ID”I„na kliknięcie„Przekierowanie zdarzenia do funkcji wyboru ():

Wyświetl tekst po sprawdzeniu pola wyboru

Pyton


Jawa


JavaScript

Następnie zdefiniuj funkcję o nazwie „pole wyboru ()". Poniższa funkcja w poniższym kroku pobrą identyfikator określonych pola wyboru za pomocą „dokument.getElementById ()" metoda.

Zastosuj także kontrolę każdego z pola wyboru. Na przykład, jeśli zaznaczone jest konkretne pole wyboru, odpowiednia wiadomość na każdym polu wyboru zostanie wyświetlona na DOM za pośrednictwem „Innertext" nieruchomość:

funkcja wybred ()
get1 = dokument.getElementById („Check1”)
get2 = dokument.getElementById („Check2”)
get3 = dokument.getElementById („Check3”)
get4 = dokument.getElementById („MSG”)
if (get1.Checked == True)
Get4.innerText = "Python Language wybrany"

inaczej, jeśli (get2.Checked == True)
Get4.innerText = "Java Language wybrany"

inaczej, jeśli (get3.Checked == True)
Get4.innerText = "JavaScript Language wybrany"

Wyjście

Metoda 2: Wyświetl tekst, gdy pole wyboru jest sprawdzane w JavaScript za pomocą JQuery

To konkretne podejście można zastosować, włączając „JQuery”Biblioteka i zastosowanie jej metod.

Przykład 1: Wyświetl tekst, gdy pole wyboru jest sprawdzane w JavaScript za pomocą metody JQuery Is ()
Tę metodę można zastosować, aby zastosować warunek na jednym z pola wyboru i odpowiednio powiadomić użytkownika.

Pierwszym krokiem będzie włączenie „JQuery" biblioteka:

Teraz określ skrzynie wyboru odnoszące się do trzech różnych opcji. Jakiś "na kliknięcie„Zdarzenie jest dołączone do każdego z pola wyboru, aby wywołać funkcję kontrolę () po sprawdzeniu konkretnego pola wyboru:

Google


Linuxhint


youtube

Wreszcie zdefiniuj funkcję o nazwie „CheckFunction ()". Tutaj zastosuj „Lub (||)" stan. Ta funkcja zostanie wykonana w taki sposób, że jak tylko określone pole wyboru zostanie zaznaczone, okno dialogowe Alert powiadomi o tym. W drugim przypadku „w przeciwnym razie„Warunek zostanie wykonany:

funkcja CheckFunction ()
if ($ ('#check1') || ('#check2') || ('#check3').sprawdzone'))
alert („Sprawdzono pola wyboru”);

w przeciwnym razie
alert („pole wyboru nie sprawdzone”);

Wyjście

Przykład 2: Wyświetl tekst, gdy pole wyboru jest sprawdzane w JavaScript za pomocą metod JQuery Ready () i Click ()
„„gotowy()”Metoda określa, co się stanie, gdy nastąpi gotowe zdarzenie i ładowany jest model obiektu dokumentu. Metoda „kliknij ()”, z drugiej strony, uruchamia funkcję do uruchomienia, gdy nastąpi zdarzenie kliknięcia. Metody te można wdrożyć, aby kliknąć dostępny pola wyboru i wyświetlić tekst pole wyboru i odpowiednią wartość.

Składnia

$ (dokument).gotowy (funkcja)

W podanej składni „funkcjonować”Odnosi się do funkcji, która ma się wykonywać po załadowaniu DOM.

$ (selektor).kliknij (funkcja)

Tutaj podobnie „„funkcjonować”Wskazuje na określoną funkcję do wykonania, gdy nastąpi zdarzenie kliknięcia.

Realizacja
Po pierwsze, dołącz następującą bibliotekę jQuery:

Następnie w „„”Tag, określ następujące etykiety i typy wejściowe dla każdego z pola wyboru:

Języki programowania:

Pyton

JavaScript

Jawa

Następnie utwórz przycisk z określonym „klasa" I "ID”:

Uzyskać wynik

Teraz, we wdrażaniu JQuery, zastosuj „gotowy() ”Metoda, że ​​gdy DOM ładuje się, kolejne kroki stają się funkcjonalne. W następnym kroku zastosuj „Kliknij()”Metoda i przyciągaj pola wyboru według ich określonych nazwisk. „„sprawdzony„Właściwość tutaj zapewni, że pole wyboru zostanie zaznaczone i zwróci odpowiednią wartość i tekst konkretnego pola wyboru za pomocą„val ()" I "tekst()”Metody odpowiednio:

$ (dokument).gotowy (funkcja ()
$ („#wynik”).kliknij (funkcja ()
$ ('input [name = "wynik"]: checked').każdy (funkcja ()
Niech wartość = $ (to).val ();
niech Text = $ ('etykieta [for = "$ value"]').tekst();
konsola.log („wartość pola wyboru to $ wartość”);
konsola.log („tekst pola wyboru to $ text”);
)
);
);

Wyjście

Ten zapis wykazał metody, które można wykorzystać do wyświetlania tekstu, gdy pole wyboru jest sprawdzane w JavaScript.

Wniosek

Aby wyświetlić tekst, gdy pole wyboru jest zaznaczone w JavaScript, zastosuj „sprawdzony„Własność wraz z„wyświetlacz„Właściwość do wyświetlenia określonej wiadomości na odpowiednim polu wyboru, który zostanie zaznaczony lub z„Innertext„Właściwość do wyświetlenia odpowiedniego tekstu na DOM, gdy tylko zaznaczono pole wyboru. Możesz także zastosować podejście jQuery z „Jest()„Metoda zastosowania„LUB”Warunki obsługi każdego z pola wyboru lub„gotowy()" I "Kliknij()”Metody klikania przybudowanego pola wyboru, gdy tylko DOM załaduje. Ten blog wykazał metody wyświetlania tekstu, gdy pole wyboru jest zaznaczone w JavaScript.