Blur event
A blur event is a browser event dispatched when an element or window loses focus.
Tiny CSS Projects
A blur event is a browser event fired when an element loses focus.
- How it is used
- Uses focus loss to mark form fields as interacted with before displaying validation errors.
- How deep it goes
- Defines the event and demonstrates its validation role, but defers JavaScript listener implementation details.
- Examples
- Demonstrates clicking or tabbing away from fields and revealing errors through the .dirty:invalid + .error span selector.
- What you can do after
- Apply it via JavaScript to identify touched fields and coordinate accessible, delayed form-validation feedback.
D3.js in Action, Third Edition
A blur event is a browser event dispatched when an element loses input focus.
- How it is used
- Supports keyboard-accessible tooltips by hiding them when focused visualization elements lose focus.
- How deep it goes
- Explains the event’s definition and its listener pairing, then applies it to entering visualization elements without browser internals.
- Examples
- Uses keyboard-accessible cetacean scatterplot circles whose tooltips hide on blur.
- What you can do after
- Apply it via the on() method to hide visualization tooltips when keyboard focus leaves an element.
Read how D3.js in Action, Third Edition explains blur event →
Related concepts
- event bubblingcontrasts with · Event bubbling is DOM event propagation in which an event travels from its target through successive ancestor nodes.
- tooltipuses · A tooltip is a transient interface label that displays brief contextual information near an associated element during interaction.
- event propagationuses · Event propagation is the process by which an event travels through a hierarchy of elements during capture, target, and bubbling phases.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.