logo

JavaScript įvykiai

Objekto būsenos pokytis yra žinomas kaip an Renginys . HTML yra įvairių įvykių, nurodančių, kad tam tikrą veiklą atlieka vartotojas arba naršyklė. Kada javascript kodas yra įtrauktas į HTML, js reaguoja į šiuos įvykius ir leidžia vykdyti. Šis reakcijos į įvykius procesas vadinamas Renginių tvarkymas . Taigi, js tvarko HTML įvykius per Renginių vedėjai .

Pavyzdžiui , kai vartotojas spustelėja naršyklę, pridėkite js kodą, kuris atliks įvykio užduotį.

Kai kurie HTML įvykiai ir jų įvykių tvarkyklės yra:

Pelės įvykiai:

Renginys atliktas Renginių vedėjas apibūdinimas
spustelėkite paspaudus Kai pele spusteli elementą
užveskite pelės žymeklį užveskite pelės žymeklį Kai pelės žymeklis pakyla virš elemento
pele ant pelės Kai pelės žymeklis palieka elementą
pele žemyn ant pelės žemyn Kai pelės mygtukas paspaudžiamas virš elemento
pele ant pelės Kai atleidžiamas pelės mygtukas virš elemento
pelės judesys onmousemove Kai vyksta pelės judėjimas.

Klaviatūros įvykiai:

Renginys atliktas Renginių vedėjas apibūdinimas
Keydown & Keyup onkeydown ir onkeyup Kai vartotojas paspaudžia ir atleidžia klavišą

Formos renginiai:

Renginys atliktas Renginių vedėjas apibūdinimas
sutelkti dėmesį fokusavimas Kai vartotojas sutelkia dėmesį į elementą
Pateikti pateikti Kai vartotojas pateikia formą
suliejimas onblur Kai dėmesys nukreiptas nuo formos elemento
pakeisti pakeitimas Kai vartotojas modifikuoja arba pakeičia formos elemento reikšmę

Lango / dokumento įvykiai

Renginys atliktas Renginių vedėjas apibūdinimas
apkrova įkėlimas Kai naršyklė baigia įkelti puslapį
iškrauti iškrovus Kai lankytojas palieka dabartinį tinklalapį, naršyklė jį iškrauna
pakeisti dydį pakeisti dydį Kai lankytojas pakeičia naršyklės lango dydį

Aptarkime keletą įvykių ir jų tvarkytojų pavyzdžių.

Spustelėkite Įvykis

 Javascript Events 
Išbandykite dabar

MouseOver renginys

 <p onmouseover="mouseoverevent()"> Keep cursor over me</p> 
Išbandykite dabar

Fokuso įvykis

 Javascript Events <h2> Enter something here</h2> 
Išbandykite dabar

Keydown įvykis

 Javascript Events <h2> Enter something here</h2> 
Išbandykite dabar

Įkelti įvykį

 Javascript Events <br> 
Išbandykite dabar