jQuery 1.4 Improves Code and Solves IE Issues
The Web Dev Zone is brought to you in partnership with Mendix. Discover how IT departments looking for ways to keep up with demand for business apps has caused a new breed of developers to surface - the Rapid Application Developer.
Improving the Code, Not the Time
Event Bubbling and Internet Explorer
A long standing problem for web builders has been dealing with Bubbling events in Internet Explorer. In jQuery 1.3, a new "live" method was added to allow simple event delegation. An event delegation occurs when events on the page bubble up so they can be handled and captured. This requires less event handlers, and makes the page run faster. Unfortunately, for people using Internet Explorer, events won't always bubble. Specifically, focus, blur, change, and submit won't bubble in IE. Juriy Zaytsev came up with a way to fix this problem in jQuery 1.4. His solution first identifies whether or not something will bubble up in IE and then implements an approximate IE event that will bubble. Focus and blur are replaced by IE's focusin and focusout events. For submit, a different solution was used. The solution had to watch for the click event, but if there was no submit button, a keypress handler was attached and that was watched. The change event was the most difficult to deal with. The solution essentially has to implement the whole change event and track every input change that occurs. Some of these workarounds for jQuery required a lot of code.
jQuery 1.4 adds the jQuery.require() script loader in order to dynamically load pieces of code without harming applications. The basic requirements for the script loader included support for loading multiple scripts with a single statement, making sure duplicate scripts aren't loaded, and loading a script synchronously if the dependent code comes immediately after. jQuery also wanted to make sure that the loader worked asynchronously so scripts could be downloaded in parallel and executed in the right order. The script loader includes URL mapping for custom URL mappers and namespaces. For example, jQuery.require("ajax", "dimensions"); will map out to ajax.js and dimensions.js. You can also use jQuery.require("jquery.ajax", jquery.fx"); to translate the full filenames jquery/ajax.js and jquery/fx.js. The URL mapper also specifies full namespaces.
To learn about all the new features coming in jQuery 1.4, you can check out the roadmap on the jQuery site. Information on jQuery 1.4 can also be found on John Resig's blog.