Jak uzyskać wartość obszaru tekstu w JavaScript?

Jak uzyskać wartość obszaru tekstu w JavaScript?
W trakcie projektowania responsywnych stron lub stron internetowych istnieje potrzeba monitowania użytkownika wprowadzonych danych w celu zapewnienia prawidłowych wprowadzonych danych. Na przykład potwierdzenie typowych maili i haseł. W drugim przypadku rejestrowanie błędu lub ostrzeżenie na wybranej opcji, co może prowadzić do poważnych konsekwencji i.wirus e itp. W takich przypadkach uzyskanie wartości obszaru tekstu w JavaScript jest bardzo pomocne w utrzymaniu prywatności danych.

Ten zapis wyjaśni podejścia, aby uzyskać wartość obszaru tekstu w JavaScript.

Jak uzyskać wartość obszaru tekstu w JavaScript?

Wartość obszaru tekstu można pobrać w JavaScript przy użyciu następujących podejść:

  • "getElementById ()" metoda.
  • "addEventListener ()" metoda.
  • "JQuery".

Podejście 1: Uzyskaj wartość obszaru tekstu w JavaScript za pomocą metody getElementById ()

„„getElementById ()„Metoda uzyskuje dostęp do elementu z określonym„ID".Tę metodę można wdrożyć w celu pobrania pola tekstu wejściowego i zwrócenia wprowadzonej wartości.

Składnia

dokument.getElementById (element)

W podanej składni:

  • "element" odnosi się do "ID„Zostanie sprowadzony wbrew konkretnemu elementowi.

Przykład
Rzućmy okiem na następujący przykład:

Zastosujmy następujące kroki w poniższym kodzie:

Uzyskaj wartość obszaru tekstu w JavaScript


Napisz coś:

Wykonaj następujące kroki:

  • W pierwszym etapie określ podany nagłówek.
  • Następnie dołącz pole tekstowe wejściowe z określonym „ID" I "symbol zastępczy" wartość.
  • Utwórz także przycisk z załączonym „na kliknięcie„Przekierowanie zdarzenia do funkcji TextAreaValue ()

Przejdźmy do części kodu JavaScript:

W powyższym kodzie JavaScript:

  • Deklaruj funkcję o nazwie „TextAreaValue ()".
  • W swojej definicji uzyskaj dostęp do pola tekstowego wejściowego według określonego identyfikatora za pomocą „getElementById ()" metoda.
  • Zastosuj także „wartość„Właściwość w celu odzyskania wprowadzonej wartości tekstowej.
  • Na koniec wyświetl wartość obszaru tekstu za pomocą „alarm”Dialog.

Wyjście

W powyższym wyjściu można zaobserwować, że wprowadzona wartość jest pobierana przez okno dialogowe Alert.

Podejście 2: Uzyskaj wartość obszaru tekstu w JavaScript za pomocą metody addEventListener ()

„„addEventListener ()„Metoda stosuje się do powiązania„wydarzenie”Z elementem. Tę metodę można wykorzystać do dołączenia zdarzenia do funkcji, tak aby wartość obszaru tekstu jest pobierana na każdym wejściu obok siebie na konsoli.

Składnia

element.addEventListener (zdarzenie, funkcja, exec)

W powyższej składni:

  • "wydarzenie”Wskazuje na nazwę wydarzenia.
  • "funkcjonować”Wskazuje funkcję uruchomienia na spust zdarzenia.
  • "Exec”To opcjonalny parametr.

Przykład
Śledźmy poniżej podanego przykładu krok po kroku:





W powyższym kodzie-snippet:

  • Określ podaną etykietę. Przewiń także „TextArea”Element z określoną wartością„ID" I "symbol zastępczy”I dostosuj również jego wymiary.
  • W części kodu JavaScript uzyskaj dostęp do określonego TEXTArea w poprzednim kroku i wyświetl go za pomocą „wartość" nieruchomość.
  • W następnym kroku załącz wydarzenie „tekst„Do pobranego”Obszar tekstowy" używając "addEventListener ()”Metoda i zastosuj ją do funkcji„TextAreaValue ()". „„wydarzenie„W swoim argumencie przekazuje informacje o uruchomionym wydarzeniu.
  • Spowoduje to zarejestrowanie każdej z wprowadzonych wartości tekstu obok siebie.

Wyjście

Z powyższego wyjścia „„ujmujący”Z każdej z wprowadzonych wartości tekstu można zaobserwować.

Podejście 3: Uzyskaj wartość obszaru tekstu w JavaScript za pomocą JQuery

"JQuery”Można zastosować, aby uzyskać dostęp do pola tekstowego wejściowego i uruchomić jego funkcjonalność, gdy tylko ładowany jest model obiektu Dokument (DOM).

Przykład
Śledźmy poniżej podanego przykładu:


Napisz coś:

W powyższych wierszach kodu wykonaj następujące kroki:

  • Dołącz bibliotekę jQuery, aby zastosować jej metody.
  • Określić "wejście”Jako pole tekstowe z określonymi wartościami„ID" I "symbol zastępczy”Jak omówiono wcześniej.
  • Utwórz także przycisk, aby uzyskać wartość przy przycisku.

Przejdź do części kodu JavaScript:

Postępuj zgodnie z określonymi krokami:

  • Aplikować "gotowy()”Metoda w celu zastosowania dalszych metod na załadowanym DOM.
  • Uzyskaj dostęp do utworzonego przycisku i dołącz „Kliknij()”Metoda, która wykona podaną funkcję w jej parametrze.
  • Metoda kliknięcia () będzie dostępna do określonego pola tekstu wejściowego i zarejestruje wprowadzoną wartość tekstową na konsoli.

Wyjście

Stąd wartość typu jest rejestrowana na konsoli.

To były różne sposoby uzyskania wartości obszaru tekstu za pomocą JavaScript.

Wniosek

„„getElementById ()„Metoda,„addEventListener ()”Metoda lub„JQuery”Można wykorzystać do uzyskania wartości obszaru tekstu w JavaScript. Metodę getElementById () można zaimplementować, aby uzyskać dostęp do pola tekstowego wejściowego i wyświetlić wprowadzoną wartość obszaru tekstu za pomocą alertu. Metodę addEventListener () można wykorzystać do dołączenia „wejście„Wydarzenie, które otrzyma wartość tekstową na każdym wejściu obok siebie. JQuery można zastosować, aby uzyskać dostęp do przycisku bezpośrednio i pobrać wprowadzoną wartość tekstową na przycisku Kliknij konsolę. Ten samouczek wyjaśnia, jak uzyskać wartość obszaru tekstu w JavaScript.