Simple events
There are many other times, apart from the loading of the page, at which we might want to perform a task. Just as JavaScript allows us to intercept the page load event with <body onload="">
or window.onload
, it provides similar hooks for user-initiated events such as mouse clicks (onclick
), form fields being modified (onchange
), and windows changing size (onresize
). When assigned directly to elements in the DOM, these hooks have similar drawbacks to the ones we outlined for onload
. Therefore, jQuery offers an improved way of handling these events as well.
A simple style switcher
To illustrate some event handling techniques, suppose we wish to have a single page rendered in several different styles based on user input. We will allow the user to click buttons to toggle between a normal view, a view in which the text is constrained to a narrow column, and a view with large print for the content area.
Tip
Progressive enhancement
In a real-world example, a good web citizen will...