Какво представляват събитията в JavaScript и как се обработват?



Събитията в JavaScript осигуряват динамичен интерфейс към уеб страница. Тези събития са свързани с елементи в обектния модел на документа (DOM).

Събитията са действия или събития, които се случват в системата. В света на програмирането, събитията са нещо, което се случва с HTML елементите. Но когато се използва в HTML страници, той може да реагира на тези събития. В тази статия ще видим кои са различните видове събития в JavaScript и как работят, в следната последователност:

Какво представляват събитията в JavaScript?

Javascript има събития, които осигуряват динамичен интерфейс към уеб страница. Тези събития са свързани с елементи в Модел на обект на документ (РЕШЕНИЕ).





Също така тези събития по подразбиране използват разпространението на балончета, т.е. нагоре в DOM от деца към родител. Можем да свързваме събития или като вградени, или във външен скрипт. С помощта на JavaScript можете да откриете кога се случват определени събития и да накарате нещата да се случват в отговор на тези събития.

Видове събития в JavaScript

Има различни видове събития в които се използват за реакция на събития. Тук ще обсъдим някои от известните или най-често използвани събития като:



  • Onclick
  • Onkeyup
  • Onmouseover
  • Натоварване
  • Фокус

Така че нека продължим и да разгледаме тези събития в JavaScript с пример.

Събитие Onclick

Събитието Onclick е събитие на мишката и предизвиква всяка логика, дефинирана, ако потребителят щракне върху елемента, към който е обвързан. Да вземем пример и да видим как работи:

функция edu () {alert ('Добре дошли в Edureka!')} Щракнете върху бутона

Изход:



Изход 1 - събития в javascript - edureka

След като щракнете върху бутона, получавате следното предупредително съобщение:

Събитие Onekeyup

Това събитие е събитие на клавиатурата и се използва за изпълнение на инструкции при всяко освобождаване на клавиш след натискане. Следващият пример показва работата на събитието:

var a = 0 var b = 0 var c = 0 функция changeBackground () {var x = document.getElementById ('bg') bg.style.backgroundColor = 'rgb (' + a + ',' + b + ',' + c + ')' a + = 1 b + = a + 1 c + = b + 1 if (a> 255) a = a - b if (b> 255) b = a if (c> 255) c = b}

Изход:

След като напишете нещо, то изглежда така:

Onmouseover събитие

Събитието onmouseover в JavaScript съответства на задържане на курсора на мишката върху елемента и неговите дъщери, към които е обвързан. Примерът е показан по-долу:

функция hov () {var e = document.getElementById ('hover') e.style.display = 'none'}

Изход:

Цветното поле се появява, преди да задържите мишката. Веднага след като задържите курсора на мишката върху полето, то изчезва.

Събитие при зареждане

Събитието onload се извиква, когато елемент се зареди напълно. Да вземем пример и да видим как работи:

  edu-Лого 

Изход:

Събитие Onfocus

Събитието Onfocus има списък с елементи, който изпълнява инструкции, когато получи фокус. Следващият пример показва как работи събитието onfocus:

функция съсредоточена () {var e = document.getElementById ('input') if (confirm ('Focus Event')) {e.blur ()}}

Фокус в полето за въвеждане:

Изход:

Пример за извикване на отдалечен метод на Java

Това са някои от най-често използваните събития в JavaScript. С това стигнахме до края на нашата статия. Надявам се, че сте разбрали какво представляват събитията и как се използват.

Вижте нашите което се предлага с обучение под ръководството на инструктори на живо и опит в реалния живот на проекти. Това обучение ви кара да владеете умения за работа с back-end и front-end уеб технологии. Включва обучение по уеб разработка, jQuery, Angular, NodeJS, ExpressJS и MongoDB.

Имате въпрос към нас? Моля, споменете го в раздела за коментари на този блог и ние ще се свържем с вас.