Ovaj zapis objasnit će pristupe dobivanju vrijednosti područja teksta u JavaScriptu.
Kako dobiti vrijednost područja teksta u JavaScriptu?
Vrijednost područja teksta može se dohvatiti u JavaScriptu pomoću sljedećih pristupa:
- “ getElementById() ” metoda.
- “ addEventListener() ” metoda.
- “ jQuery ”.
Pristup 1: Dobijte vrijednost područja teksta u JavaScriptu pomoću metode getElementById()
' getElementById() ” metoda pristupa elementu s navedenim “ iskaznica ”.Ova se metoda može implementirati za dohvaćanje polja za unos teksta i vraćanje unesene vrijednosti u njemu.
Sintaksa
dokument. getElementById ( element )
U navedenoj sintaksi:
- “ element ' odnosi se na ' iskaznica ” koje treba dohvatiti prema određenom elementu.
Primjer
Pogledajmo sljedeći primjer:
Primijenimo sljedeće korake u donjem kodu:
< h3 > Dohvati vrijednost područja teksta u JavaScript h3 >
Upišite nešto : < vrsta unosa = 'tekst' iskaznica = 'txt' rezerviranog mjesta = 'Unesite tekst...' >
< gumb na klik = 'textareaValue()' > Ostvarite vrijednost dugme >
Izvršite sljedeće korake:
- U prvom koraku odredite navedeni naslov.
- Nakon toga uključite polje za unos teksta s navedenim ' iskaznica ' i ' rezerviranog mjesta ” vrijednost.
- Također, izradite gumb s priloženim ' na klik ” preusmjeravanje događaja na funkciju textareaValue()
Prijeđimo naprijed na JavaScript dio koda:
< skripta >funkcija textareaValue ( ) {
neka dobiti = dokument. getElementById ( 'txt' ) . vrijednost
uzbuna ( dobiti )
}
skripta >
U gornjem JavaScript kodu:
- Deklarirajte funkciju pod nazivom ' textareaValue() ”.
- U njegovoj definiciji, pristupite tekstualnom polju za unos prema njegovom navedenom ID-u koristeći ' getElementById() ” metoda.
- Također, primijenite ' vrijednost ” kako biste dohvatili unesenu tekstualnu vrijednost.
- Na kraju, prikažite vrijednost područja teksta putem ' uzbuna ” dijaloški okvir.
Izlaz
U gornjem izlazu može se primijetiti da se unesena vrijednost dohvaća putem dijaloškog okvira upozorenja.
Pristup 2: Dobijte vrijednost područja teksta u JavaScriptu pomoću metode addEventListener()
' addEventListener() ' metoda se koristi za pridruživanje ' događaj ” s elementom. Ova se metoda može koristiti za pridruživanje događaja funkciji tako da se vrijednost područja teksta dohvaća pri svakom unosu jedan pored drugog na konzoli.
Sintaksa
element. addEventListener ( događaj , funkcija , izvrs )U gornjoj sintaksi:
- “ događaj ” pokazuje na naziv događaja.
- “ funkcija ” označava funkciju koja se pokreće nakon okidača događaja.
- “ izvrs ” je izborni parametar.
Primjer
Slijedimo dolje navedeni primjer korak po korak:
< id tekstualnog područja = 'txtarea' redaka = '5' cols = '25' rezerviranog mjesta = 'Unesi tekst...' > tekstualno područje >
< vrsta skripte = 'tekst/javascript' >
neka dobiti = dokument. getElementById ( 'txtarea' ) ;
konzola. log ( dobiti . vrijednost ) ;
dobiti . addEventListener ( 'ulazni' , funkcija textareaValue ( događaj ) {
konzola. log ( događaj. cilj . vrijednost ) ;
} ) ;
skripta >
U gornjem isječku koda:
- Navedite navedenu oznaku. Također, dodijelite ' tekstualno područje ' element s navedenom vrijednošću ' iskaznica ' i ' rezerviranog mjesta ” te prilagodite i njegove dimenzije.
- U JavaScript dijelu koda pristupite navedenom tekstualnom području u prethodnom koraku i prikažite ga pomoću ' vrijednost ” vlasništvo.
- U sljedećem koraku priložite događaj ' tekst ” na preuzeto ” područje teksta ' koristiti ' addEventListener() ' metodu i primijenite je na funkciju ' textareaValue() ”. ' događaj ” u svom argumentu prosljeđuje informacije o događaju koji je pokrenut.
- To će rezultirati bilježenjem svake od unesenih tekstualnih vrijednosti jednu pored druge.
Izlaz
Iz gornjeg izlaza, ' dohvaćanje ” svake od unesenih tekstualnih vrijednosti može se promatrati.
Pristup 3: Dobijte vrijednost područja teksta u JavaScriptu pomoću jQueryja
“ jQuery ” može se primijeniti za pristup tekstualnom polju za unos i pokretanje njegovih funkcija čim se učita Document Object Model (DOM).
Primjer
Slijedimo dolje navedeni primjer:
Upišite nešto : < vrsta unosa = 'tekst' iskaznica = 'txt' rezerviranog mjesta = 'Unesite tekst...' >
< dugme > Ostvarite vrijednost dugme >
U gornjim redcima koda izvršite sljedeće korake:
- Uključite biblioteku jQuery kako biste primijenili njezine metode.
- Navedite ' ulazni ” kao tekstualno polje s navedenim vrijednostima „ iskaznica ' i ' rezerviranog mjesta ” kao što je već spomenuto.
- Također, kreirajte gumb kako biste dobili vrijednost nakon klika na gumb.
Prijeđite na JavaScript dio koda:
< skripta >$ ( dokument ) . spreman ( funkcija ( ) {
$ ( 'dugme' ) . klik ( funkcija ( ) {
konzola. log ( $ ( 'unos:tekst' ) . val ( ) ) ;
} ) ;
} ) ;
skripta >
Slijedite navedene korake:
- Primijeni ' spreman() ” kako biste primijenili daljnje metode na učitani DOM.
- Pristupite kreiranom gumbu i priložite ' klik() ” metoda koja će izvršiti navedenu funkciju u svom parametru.
- Metoda click() će pristupiti navedenom tekstualnom polju za unos i zabilježiti unesenu tekstualnu vrijednost na konzoli.
Izlaz
Stoga se vrijednost tipa bilježi na konzoli.
Sve su to bili različiti načini dobivanja vrijednosti tekstualnog područja uz pomoć JavaScripta.
Zaključak
' getElementById() ' metoda, ' addEventListener() ' metoda ili ' jQuery ” može se koristiti za dobivanje vrijednosti područja teksta u JavaScriptu. Metoda getElementById() može se implementirati za pristup tekstualnom polju za unos i prikaz unesene vrijednosti tekstualnog područja putem upozorenja. Metoda addEventListener() može se koristiti za prilaganje ' ulazni ” događaj koji će dobiti tekstualnu vrijednost nakon svakog unosa jednu pored druge. jQuery se može primijeniti za izravan pristup gumbu i dohvaćanje unesene tekstualne vrijednosti nakon klika na gumb na konzoli. Ovaj vodič objašnjava kako dobiti vrijednost područja teksta u JavaScriptu.