Scoping can be accomplished by passing an object as a property to a connection handle (
on*). Here is an example where the supplied functions will execute within the scope of the
For more information on
dojo.connect(), see my Event Listening Made Easy with Dojo.connect article. To learn more about
dojo.publish(), see my article entitled The Dojo Publish/Subscribe Event Mechanism.
Overriding the Browser's Default Behavior
Event.preventDefault()within your handler:
Our final example shows a more complex user-defined behavior object. It utilizes a CSS class with the
dojo.removeClass() methods to highlight and restore text on the
mouseleave events. The
<DIV> element, which has a class of "highlighted_text", matches the CSS3 pattern in the
widgets.plugins.textHighlighter.behavior object. The
widgets.plugins.textHighlighter.unformat() functions effectuate the changes to the text appearance by adding the "highlighted" class on the
mouseenter event, and removing it on the
mouseleave event. What makes this code particularly effective is that the CSS information is stored separately from the script. Moreover, housing the code in a plug-in widget allows us to easily add the TextHighligher to any page:
Here is what it looks like in the browser. First, the non-highlighted text:
The highlighted text:
Where's the Disconnect Code?
dojo.behavior quirk is that
dojo.behavior.add() doesn't return any handles so you cannot remove behavior once it has been added. Some have suggested that a global suspend/resume API might be a useful addition to the
dojo.behavior API to allow a developer to stop and start behaviors, but from all accounts, the Dojo support group has no plans to implement anything in the foreseeable future.
I hope that you found today's article on the
dojo.behavior module to be informative and interesting. After reviewing the syntax and various uses of this versatile module, I think that you'll agree that it makes a great addition to
dojo.publish. To recap, some of
dojo.behavior's main draws are that:
- behaviors can be added to DOM elements which have yet to be inserted into the document. This allows the developer to organize all the behavior for a page in one place, such as in the
- as we saw in the last example, you can add behavior to dynamically added DOM elements.
- it allows for easily assembling multiple behaviors to elements in the one statement.
- it uses syntax which is similar to that of other frameworks, such as jquery's live method.
Here is the source file containing today's code. It's ready to go, except that you'll have to point the Dojo script to your own host directory.
- Chart of standard CSS3 selectors supported by Dojo
- More on dojo.style
- No remove() in sight for dojo.behavior
Have a suggestion for an article topic? Do you have a product or service that you'd like reviewed? Email it to Rob .
resides in Ottawa, Canada, and is the founder of GravelleConsulting.com. Rob has built systems for Intelligence-related organizations such as Canada Border Services, CSIS as well as for numerous commercial businesses. Rob to receive a free estimate on your software project. Should you hire Rob and his firm, you'll receive 15% off for mentioning that you heard about it here!
In his spare time, Rob has become an accomplished guitar player, and has released several CDs. His former band, Ivory Knight, was rated as one Canada's top hard rock and metal groups by Brave Words magazine (issue #92). MP3s of his covers project are available from iTunes and other digital music sites.
Rob uses and recommends MochaHost, which provides Web Hosting at $3.10 per month, 2 LifeTime Free Domains, and 6 Months Free!
Original: April 27, 2011