Како добити вредност области текста у ЈаваСцрипт-у?

Kako Dobiti Vrednost Oblasti Teksta U Javascript U



У процесу дизајнирања респонзивних веб страница или сајтова, постоји потреба да се кориснику сугерише унети подаци како би се обезбедио тачност унетих података. На пример, потврђивање укуцаних мејлова и лозинки. У другом случају, евидентирање грешке или упозорења на изабрану опцију која може довести до неке озбиљне последице, нпр. вируса итд. У таквим сценаријима, добијање вредности области текста у ЈаваСцрипт-у је од велике помоћи у одржавању приватности података.

Овај текст ће објаснити приступе за добијање вредности области текста у ЈаваСцрипт-у.

Како добити вредност области текста у ЈаваСцрипт-у?

Вредност области текста се може преузети у ЈаваСцрипт-у коришћењем следећих приступа:







  • гетЕлементБиИд() ” метод.
  • аддЕвентЛистенер() ” метод.
  • јКуери ”.

Приступ 1: Добијте вредност области текста у ЈаваСцрипт-у помоћу методе гетЕлементБиИд()

гетЕлементБиИд() ” метода приступа елементу са наведеним „ ид .Овај метод се може применити да дохвати поље за унос текста и врати унету вредност у њему.



Синтакса



документ. гетЕлементБиИд ( елемент )

У датој синтакси:





  • елемент “ односи се на “ ид ” који се преузима од одређеног елемента.

Пример
Хајде да погледамо следећи пример:

Хајде да применимо следеће кораке у коду испод:



< х3 > Добијте вредност области текста ин ЈаваСцрипт х3 >
Откуцате нешто : < тип уноса = 'текст' ид = 'ткт' чувар места = „Унесите текст...“ >
< дугме онцлицк = 'тектареаВалуе()' > Гет Валуе дугме >

Извршите следеће кораке:

  • У првом кораку наведите наведени наслов.
  • Након тога, укључите поље за унос текста са наведеним „ ид ' и ' чувар места ” вредност.
  • Такође, направите дугме са приложеним „ онцлицк ” догађај који преусмерава на функцију тектареаВалуе()

Пређимо на ЈаваСцрипт део кода:

< скрипта >
функција тектареаВалуе ( ) {
дозволити добити = документ. гетЕлементБиИд ( 'ткт' ) . вредност
узбуна ( добити )
}
скрипта >

У горњем ЈаваСцрипт коду:

  • Објавите функцију под називом „ тектареаВалуе() ”.
  • У његовој дефиницији, приступите пољу за унос текста по његовом наведеном ИД-у користећи „ гетЕлементБиИд() ” метод.
  • Такође, примените „ вредност ” да бисте преузели унету текстуалну вредност.
  • На крају, прикажите вредност области текста преко „ узбуна ” оквир за дијалог.

Излаз

У горњем излазу, може се приметити да се унета вредност преузима преко дијалога упозорења.

Приступ 2: Добијте вредност области текста у ЈаваСцрипт-у користећи метод аддЕвентЛистенер()

аддЕвентЛистенер() ” метода се користи за повезивање „ догађај ” са елементом. Овај метод се може користити за прикључивање догађаја функцији тако да се вредност области текста дохвати на сваком улазу један поред другог на конзоли.

Синтакса

елемент. аддЕвентЛистенер ( догађај , функција , екец )

У горњој синтакси:

  • догађај ” указује на назив догађаја.
  • функција ” означава функцију која се покреће након покретача догађаја.
  • екец ” је опциони параметар.

Пример
Пратимо доле дати пример корак по корак:

< етикета за = 'ткт' > Откуцате нешто : етикета >< бр >< бр >
< тектареа ид = 'тктареа' редова = '5' цолс = '25' чувар места = 'Унесите текст...' > тектареа >
< тип скрипте = 'текст/јавасцрипт' >
дозволити добити = документ. гетЕлементБиИд ( 'тктареа' ) ;
конзола. Пријава ( добити . вредност ) ;
добити . аддЕвентЛистенер ( 'улазни' , функција тектареаВалуе ( догађај ) {
конзола. Пријава ( догађај. циљ . вредност ) ;
} ) ;
скрипта >

У горњем исечку кода:

  • Наведите наведену ознаку. Такође, доделите „ тектареа ” елемент са наведеном вредношћу „ ид ' и ' чувар места ” и прилагодите његове димензије.
  • У ЈаваСцрипт делу кода, приступите наведеном текстуалном подручју у претходном кораку и прикажите га помоћу „ вредност ' имовина.
  • У следећем кораку приложите догађај „ текст ” до преузетог “ област текста ' помоћу ' аддЕвентЛистенер() ” метод и примени га на функцију “ тектареаВалуе() ”. „ догађај ” у свом аргументу преноси информацију о догађају који је покренут.
  • Ово ће резултирати евидентирањем сваке од унетих текстуалних вредности једну поред друге.

Излаз

Из горњег излаза, „ доношење ” сваке од унетих текстуалних вредности може се уочити.

Приступ 3: Добијте вредност области текста у ЈаваСцрипт-у користећи јКуери

јКуери ” се може применити за приступ пољу за унос текста и активирање његових функционалности чим се учита модел објекта документа (ДОМ).

Пример
Хајде да пратимо доле дат пример:

< сцрипт срц = 'Ц119ДДЦ4660689Д648Е7288АФ068ЦА5692Б05Д25' > скрипта >
Откуцате нешто : < тип уноса = 'текст' ид = 'ткт' чувар места = „Унесите текст...“ >
< дугме > Гет Валуе дугме >

У горњим редовима кода извршите следеће кораке:

  • Укључите јКуери библиотеку да бисте применили њене методе.
  • Наведите „ улазни ” као текстуално поље са наведеним вредностима „ ид ' и ' чувар места ” као што је већ дискутовано.
  • Такође, креирајте дугме да бисте добили вредност након клика на дугме.

Пређите на ЈаваСцрипт део кода:

< скрипта >
$ ( документ ) . спреман ( функција ( ) {
$ ( 'дугме' ) . кликните ( функција ( ) {
конзола. Пријава ( $ ( 'унос текста' ) . вал ( ) ) ;
} ) ;
} ) ;
скрипта >

Пратите наведене кораке:

  • Примените „ спреман() ” како би применили даље методе на учитани ДОМ.
  • Приступите креираном дугмету и приложите „ клик () ” који ће извршити наведену функцију у свом параметру.
  • Метода цлицк() ће приступити наведеном пољу за унос текста и евидентирати унету текстуалну вредност на конзоли.

Излаз

Дакле, вредност типа се евидентира на конзоли.

Све су то били различити начини добијања вредности области текста уз помоћ ЈаваСцрипт-а.

Закључак

гетЕлементБиИд() ” метод, „ аддЕвентЛистенер() ” метод или „ јКуери ” се може користити за добијање вредности области текста у ЈаваСцрипт-у. Метод гетЕлементБиИд() се може имплементирати да приступи пољу за унос текста и прикаже унету вредност области текста путем упозорења. Метода аддЕвентЛистенер() се може користити за причвршћивање „ улазни ” догађај који ће добити текстуалну вредност на сваком уносу један поред другог. јКуери се може применити за директан приступ дугмету и преузимање унете вредности текста након клика на дугме на конзоли. Овај водич објашњава како да добијете вредност области текста у ЈаваСцрипт-у.