Events in JavaScript
We will discuss various events in JavaScript and associated triggers with example. Some practical examples we will develop through demo of these scripts.
Mouse Effect Description onMouseover & onMouseout change the background color of row or swap images on Mouseover onMousedown & onMouseup Events triggered when Mouse is clicked and when it is released. onMousemove When mouse is moved over the elements this event is triggered Hide/show Display of Layer with onClick event of button onClick Text box click event onClick OnClick event of period button onClick Selecting all the data of inside textarea by clicking Counter Counting the characters dynamically inside a textarea and setting a limit onblur onBlur event when focus moves out or on lost focus ondblClick Managing both Single and Double click events onBlur Showing help text by using onfocus and onBlur event triggers Copy Data Copying a set of textbox entered data to another area of a form Copy Listbox Copying data along with drop down list box selection inside a form
Keyboard Events Description onKeyPress While pressing a key the event to trigger onKeyDown Events to trigger whle a key is down onKeyUp Events to trigger on release of a key on keyboard
Messages Description Message Showing Help message on mouseover using Div tag Message Hide and displaying layers through radio buttons Message Status bar Message on Mouseover event of a link Progress bar Progress bar value attributes by button click Arrow Key Detecting arrow key press event Key event Detecting key pressed by user Keyboard Virtual keyboard : Detecting key pressed based on screen location clientX and clientY clientX and clientY to get horizontal and vertical coordinates
We can trigger events when we focus on any form component like textbox, radio button , checkbox etc. This can be achieved by shifting crusher to the component or by moving it by using tab , we can click on the component and keep the focus on it.
We can display a message or trigger some script when visitor exit the page or closes the browser tab.
← Subscribe to our YouTube Channel here
This article is written by plus2net.com team.
plus2net.com
Events Handling in JavaScript