Button eventsClick
DoubleClick Mousedown Mouseenter Mousemove Mouseover Mouseup Mousewheel Mouseout Mouseleave |
Quick Notes//onClick event that does not require external JS script eventhough it is a better practice to use it.
<input type = "button" value = "submit" onclick = "alert('foo')" /> //onClick event that does require external JS script <input id = "submit1" type = "button" value = "submit1" onclick="submitForm()" /> //this is example using mouseover <input id = "submit1" type = "button" value = "submit1" onmouseover="submitForm()" /> <input id = "submit1" type = "button" value = "submit1" onmouseout="submitForm1()" /> Your external Javascript function submitForm() { alert("you clicked function"); } function submitForm1() { alert("Mouseout"); } |
Example 1
Let's say we want to see an alert that lets us know which Id name the button is using. we need to use THIS. HTML <input id = "submit1" type = "button" value = "submit" onclick = "submitForm(this)" /> CSS #submit1 { background-color: #4CAF50; /* Green */ border: none; color: white; padding: 10px 10px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; } #submit1:hover { background-color: red; } Javascript function submitForm(element) { alert(element.id); } |
|