{"id":343064,"date":"2021-06-30T07:45:42","date_gmt":"2021-06-30T14:45:42","guid":{"rendered":"https:\/\/css-tricks.com\/?p=343064"},"modified":"2021-07-18T21:56:04","modified_gmt":"2021-07-19T04:56:04","slug":"when-a-click-is-not-just-a-click","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/when-a-click-is-not-just-a-click\/","title":{"rendered":"When a Click is Not Just a Click"},"content":{"rendered":"\n
The As often the case with the DOM and JavaScript, there are nuances to consider. Some nuances with the click <\/kbd>event are typically not much a concern. They are minor and probably most people would never even notice them in the majority of use cases.<\/p>\n\n\n\n\n\n\n\n Take, for example, the How do we distinguish between different types of clicks? That\u2019s what we\u2019re diving into!<\/p>\n\n\nclick<\/code> event is quite simple and easy to use; you listen for the event and run code when the event is fired. It works on just about every HTML element there is, a core feature of the DOM API.<\/p>\n\n\n\n
click<\/code> event listening to the grandfather of interactive elements, the
<button><\/code> element. There are nuances associated with button clicks and these nuances, like the difference between a \u201cclick\u201d from a mouse pointer and \u201cclick\u201d from the keyboard. Seen this way, a click is not always a \u201cclick\u201d the way it\u2019s typically defined. I actually have run into situations (though not many) where distinguishing between those two types of clicks comes in handy.<\/p>\n\n\n\n
First things first<\/h3>\n\n\n