fca1693f-5ba4-4bf5-b4f6-dbd564f3255c
fca1693f-5ba4-4bf5-b4f6-dbd564f3255c
Q: Define Event?
1. T h in g s th a t s h o u ld b e d o n e ev ery tim e a p a g e lo a d s
2. T h in g s th a t s h o u ld b e d o n e w h en the p a g e is c lo s ed
3. A c tio n th a t s h o u ld b e p erfo rm ed w h e n a u s e r c lic k s a b u tto n
4. C o n te n t th a t s h o u ld b e v erified w h e n a u s er in p u ts d a ta
T h es e a re th e to p 5 typ e s o f J a va S c rip t E v en t d is c u s s e d b e lo w :
● onload
T h e lo a d e ve n t fire s w h en th e w eb p a g e fin is h es lo a d in g . It c a n a ls o fire o n n o d es o f
ele m e n ts lik e
● onunload
T h is ev en t fire s b e fo re th e us e rs le a ve th e p a g e, i. e., th e w e b p a g e is u n lo a d in g . P a g e
u n lo a d in g u s u a lly h a p p e n s b e c a u s e a n ew p a g e h a s b e en re q u e s te d .
● onerror
● onresize
2. Mouse events
● onclick
● ondblclick
● onmousedown
It fire s w h e n th e u s e r c lic k s d o w n o n a n y m o u s e b u tto n . Y o u c a n u s e th e touchstart ev en t.
● onMouseup
● onmouseover
● onmouseout
It fires w h e n th e u s er m o v es th e c u rs o r, w h ic h w a s in s id e a n e le m en t b e fo re, o u ts id e th e
ele m e n t. W e c a n s a y th a t it fires w h en th e c u rs o r m o ve s o ff th e ele m e n t. T h e m o u s e o v er
a n d m o u s eo u t ev en ts u s u a lly c h a n g e th e a p p ea ra n c e o f g ra p h ic s o n o u r w eb p a g e. A
p re fered a ltern a tive to th is is to u s e th e CSS: hover p s e u d o -c la s s .
● onmousemove
It fire s w h e n th e u s e r m o v es th e c u rs o r a ro u n d th e e le m e n t. Th is ev en t is f re q u e n tly
trig g ere d .
3. Keyboard events
T h es e ev en ts f ire o n a n y k in d o f d ev ic e w h e n a u s er in te ra c ts w ith a k ey b o a rd .
● onkeydown
● onkeypress
● onkeyup
T h e k eyu p e ve n t fire s w h en th e u s e r relea s e s a k ey o n th e k e yb o ard . T h e k e yd o w n a n d
k ey p res s ev en ts fire b e fo re a c h a ra c te r a p p ea rs o n th e s c re en , th e k e yu p fires a fter it
s h o w s . T o k n o w th e k e y p res s e d w h e n yo u u s e th e k eyd o w n a n d k eyp re s s e ve n ts , th e
ev en t o b jec t h a s a keyCode p ro p erty. T h is p ro p e rty, in s te a d o f retu rn in g th e le tter fo r th a t
k ey , re tu rn s th e A S C II c o d e o f th e lo w e rc a s e fo r th a t k e y.
4. Form events
● onsubmit
● On reset
5. Focus events
T h es e ev en ts fire w h e n th e H T M L e le m e n ts yo u c a n in te ra c t w ith g a in / lo s e f o c u s . T he y
a re m o s t c o m m o n ly u s ed in fo rm s . T o trig g e r fo rm v a lid a tio n a s a u s er m o v es fro m o n e
c o n tro l to th e n ex t w ith o u t w a itin g to s u b m it th e f o rm .
● onfocus
T h is e ve n t fires , f o r a s p ec if ic D O M n o d e , w h en a n elem en t g a in s fo c u s .
Ans:
< h tm l>
< h ea d >
< title> E v en t h a n d lin g < /title >
fu n c tio n s a yh e llo ( )
F u n c tio n s a yb ye ( )
a lert(“ G o o d b ye to ev ery o n e ” );
< b o d y>
Ans:
< h tm l>
< h ea d >
fu n c tio n fu n fo c u s ( )
{
A le rt(“ c lic k ed in th e in p u t” ) ;
< b o d y>
< / b o d y>
< / h tm l>
Ans:
< h tm l>
fu n c tio n e rro rh a n d le r( )
< b o d y>
< / b o d y>
< / h tm l>
Ans:
< h tm l>
fu n c tio n fu n u n lo a d ( )
H ello
Ans:
< h tm l>
< h ea d >
< b o d y>
fu n c tio n k e yd o w n ( )
a lert(“ k ey p re s s ed ” );
fu n c tio n k e yu p ( )
{
a lert(“ k ey relea s e d ” );
fu n c tio n k e yp res s ( )
a lert(“ k ey p re s s ed a n d re le a s ed ” );
Ans:
< h tm l>
< h ea d >
< b o d y>
fu n c tio n v a lid a te fo rm ( )
v ar x= d o c u m e n t. m yF o rm .f na m e .va lu e;
if(x = = nu ll || x == ” “ )
}
els e
< p re >
< / p re>
Ans:
< h tm l>
< h ea d >
fu n c tio n m o u s e U p ( )
a lert(“ T h e m o u s e b u tto n is re le a s ed o n th e im a g e ” );
fu n c tio n m o u s e M o ve ( )
a lert(“ T h e m o u s e m o v es o v er the im a g e” );
< b r>
Ans:
< h tm l>
< h ea d >
fu n c tio n o ve r( )
a lert(“ m o u s e o v er” );
fu n c tio n o u t( )
a lert(“ m o u s e o u t” );
< b o d y>
Ans:
< h tm l>
< h ea d >
fu n c tio n fu n s iz e( )
a lert(“ w in d o w re s ize d ” );
fu n c tio n fu n m o v e( )
a lert(“ w in d o w m o ve d ” );
< b o d y o n re s iz e= ” f u nw s iz e( )” o n m o v e= ” fu n m o v e( ) ” >
Ans:
< h tm l>
< h ea d >
fu n c tio n fu n res e t( )
fu n c tio n fu n s e le c t( )
{
a lert(“ s e lec t a n d c o p y n o t a llo w ed ” );
< b o d y>