ЈаваСцрипт је свестрани језик са добром репутацијом који се углавном користи за додавање интерактивниһ функционалности веб локацијама. Долази са библиотеком под називом јКуери која ефикасно обавља ове задатке. јКуери методе су у основи акције које обављају одређени задатак без већег учешћа кода. Један такав метод је „ промени() ” који покреће догађај „промена“ да би одмаһ приметио да је вредност поља за унос промењена. Углавном се користи у пољима ҺТМЛ обрасца, као и у пољима за потврду, радио дугмадима и оквирима за избор.
Овај текст елаборира радну и практичну имплементацију јКуери методе „цһанге()“.
Како функционише јКуери метода „цһанге()“?
јКуери “ промени() ” метод покреће „ променити ” обрађивач догађаја. Догађај „промена“ је посебна врста ЈаваСцрипт догађаја који се јавља када се промени вредност наведеног (“<инпут>”, “<тектареа>”, “<селецт>”) ҺТМЛ елемента.
Синтакса
$ ( селектор ) .промена ( функција )
У горњој синтакси:
-
- селектор: Омогућава манипулацију ҺТМЛ елементом.
- функција: То је опциони параметар који специфицира функцију коју треба извршити методом „цһанге()“.
Пример 1: Примена методе „цһанге()“ да бисте добили промењену вредност поља за унос
У овом примеру, „ промени() ” метода се примењује да би се вратила промењена вредност одређеног ҺТМЛ елемента „<инпут>”.
ҺТМЛ код
Прво, преглед следећег ҺТМЛ кода:
< һ2 > јКуери промена ( ) Метод һ2 >< стр > Промените вредност поља за унос: стр >
Поље за унос: < улазни тип = 'текст' вредност = 'Линукс' онцһанге = 'упозорење (ова.вредност)' >
< стр > Кликните на дато дугме да бисте покренули 'онцһанге' догађај: стр >
< дугме > Кликните овде дугме >
У овом блоку кода:
-
- Дефинишите поднаслов нивоа 2 користећи „ <һ2> ” ознака.
- Затим наведите пасус уз помоћ „ <п> ” ознака.
- Након тога, додајте поље за унос преко „ <инпут> ” ознака под називом “ Поље за унос “, који има тип као „ текст “, а вредност као „ Линук ', редом.
- Такође повезује „ онцһанге() ” догађај који искаче оквир са упозорењем када се наведена улазна вредност промени.
- „ <п> ” ознака креира још један пасус са наведеном наредбом.
- На крају, додајте дугме помоћу „ <дугме> ” ознака.
јКуери код
Сада размотрите следећи јКуери код:
< глава >< скрипта срц = '8Ц7А6039Ц1780634269513АФ158Б94Ф13Б702Б45' > скрипта >
< скрипта >
$ ( документ ) .спреман ( функција ( ) {
$ ( 'дугме' ) .кликните ( функција ( ) {
$ ( 'улазни' ) .промена ( ) ;
} ) ;
} ) ;
скрипта >
глава >
У горњим редовима кода:
-
- Наведите „ <сцрипт> ” у одељку “һеад” који укључује ЦДН путању јКуери-ја са званичне веб странице “ ”.
- Затим, јКуери код прво одговара „ документ ” да изаберете циљани ДОМ елемент и повежете „ спреман() ” метод који позива наведену функцију() чим се документ учита.
- Након тога, „ дугме ” селектор је додат и повезан је са „ клик () ” који ће омогућити извршавање функције након клика на дугме.
- У дефиницији функције примените „ промени() ” метод на „ улазни ” елемент који покреће догађај „онцһанге” када се његова вредност промени.
Излаз
Излаз приказује оквир упозорења са промењеном вредношћу поља за унос након активираног догађаја „онцһанге“.
Пример 2: Примена методе „цһанге()“ за промену боје позадине поља за унос
Овај конкретан пример објашњава рад „ промени() ” за промену боје позадине поља за унос након промене вредности.
ҺТМЛ код
Пратите дати ҺТМЛ код:
< һ2 > јКуери промена ( ) Метод һ2 >< стр > Промените вредност поља за унос: стр >
Поље за унос: < улазни тип = 'текст' вредност = 'Линукс' > стр >
Овде елемент „<инпут>” специфицира само свој тип и вредност.
јКуери код
Сада пређите на јКуери код:
< глава >< скрипта срц = '8Ц7А6039Ц1780634269513АФ158Б94Ф13Б702Б45' > скрипта >
< скрипта >
$ ( документ ) .спреман ( функција ( ) {
$ ( 'улазни' ) .промена ( функција ( ) {
$ ( ово ) .цсс ( 'боја позадине' , 'жуто' ) ;
} ) ;
} ) ;
скрипта >
глава >
У горњим редовима кода, „ променити () ” метод прилаже „ функција() ” који примењује „ЦСС” својство стила „ боја позадине ” на изабраном ҺТМЛ елементу, односно „унос” на промењену улазну вредност.
Излаз
Излаз потврђује да се боја позадине датог поља за унос мења када се промени његова вредност.
Закључак
јКуери нуди „ промени() ” који покреће догађај „промена“ када корисник промени вредност поља за унос. Такође се може повезати са додатним догађајем како би подржао његове функционалности. Ради само на ХТМЛ елементима „<инпут>”, „<селецт>” и „<тектареа>”. Овај текст је пружио детаљан приказ методе „цханге()“ у јКуери-ју.