Mouse Click Event
Ondblclick
Mouse Double Click Event
Onmouseover
Mouse Hover In Event
Onmouseout
Mouse Leave Event
Onmousemove
Mouse Movement Event
Onmousedown
Mouse Down Event
Onmouseup
Mouse Up Event
Keyboard Events
The order of execution for keyboard events is: onkeydown → onkeypress → onkeyup.
Onkeydown
Key Pressed Event (includes all keys, including function and numeric keys)
Onkeypress
Key Pressed Event (only numeric keys are captured here)
Onkeyup
Key Released Event (includes all keys, including function and numeric keys)
Form Events
(1) onfocus event – triggered when an element receives focus
(2) onblur event – triggered when an element loses focus
(3) onchange event – triggered when the value of a form element changes (e.g., dropdown selection)
(4) onselect event – triggered when text is selected in a single-line or multi-line text box
There are three elements that support focus and blur events:
(1) Single-line text input field
(2) Multi-line text area
(3) Dropdown list (select element)
Editing Events
(1) oncopy event – triggered when text is copied
(2) oncut event – triggered when text is cut
(3) onpaste event – triggered when text is pasted
Page-Related Events
(1) onload event – executed after the document has fully loaded
window.onload = function() { ... }
(2) onresize event – triggered when the window size changes
(3) onerror event – triggered when an error occurs during loading
The onscroll event fires when the scroll bar of an element is moved.
addEventListener() Method
element.addEventListener(event, function, useCapture);
The first parameter specifies the type of event, such as "click" or "mousedown".
The second parameter is the function to be called when the event occurs.
The third parameter is a boolean indicating whether the event should be captured or bubbled. This is optional.
Note: Do not include the "on" prefix. For example, use "click" instead of "onclick".
Adding an Event Handler to an Element
element.addEventListener("click", function() { alert("Hello World!"); });
Adding Multiple Event Handlers to the Same Element
element.addEventListener("mouseover", myFunction);
element.addEventListener("click", mySecondFunction);
Adding an Event Handler to the Window Object
window.addEventListener("resize", function() {
document.getElementById("demo").innerHTML = someText;
});
Passing Parameters to Event Functions
element.addEventListener("click", function() { myFunction(p1, p2); });
removeEventListener() Method
The removeEventListener() method removes an event handler added by addEventListener().
element.removeEventListener("mousemove", myFunction);
Magnetic Transducer,Smd Magnetic Transducer,Buzzer Magnetic Transducer,Magnetic Transducer Buzzer
NINGBO SANCO ELECTRONICS CO., LTD. , https://www.sancobuzzer.com