Join the AI Workshop to learn more about AI and how it can be applied to web development. Next cohort February 1st, 2026
The AI-first Web Development BOOTCAMP cohort starts February 24th, 2026. 10 weeks of intensive training and hands-on projects.
We have a number of events we can listen for in form elements
inputfired on form elements when the element value is changedchangefired on form elements when the element value is changed. In the case of textinputelements andtextarea, it’s fired only once when the element loses focus (not for every single character typed)cutfired when the user cuts text from the form elementcopyfired when the user copies text from the form elementpastefired when the user pastes text into the form elementfocusfired when the form element gains focusblurfired when the form element loses focus
Here’s a sample form demo on Codepen:
See the Pen Form events demo by Flavio Copes (@flaviocopes) on CodePen.
Lessons in this unit:
| 0: | Introduction |
| 1: | Handling events |
| 2: | The `DOMContentLoaded` event |
| 3: | The `event` object |
| 4: | Mouse events |
| 5: | Keyboard events |
| 6: | `preventDefault()` |
| 7: | Stopping event propagation |
| 8: | Bubbling and capturing |
| 9: | Form submit event |
| 10: | ▶︎ Input fields events |
| 11: | Creating custom events |
| 12: | Keyboard Events |
| 13: | Mouse Events |
| 14: | Touch Events |
| 15: | Form Events |