Friday, May 18th, 2007

Automating JS Behavior Registration

Category: JavaScript, Library, Unobtrusive JS

Gabriel Handford has created a behavior.js script that allows you to unobtrusively automate Event.observe’tion.

Magic is in naming conventions, so that:

  1. <a class="bvr-observe-click-xhrTheFunction" href="/the/href">The link</a>

takes care of:


  1. Event.observe(theLinkElement, "click", function(event) { xhrTheFunction(event) });

Posted by Dion Almaer at 12:04 am

3.2 rating from 40 votes


Comments feed TrackBack URI

It’s amusing that standards freaks actually believe [a class=”bvr-observe-click-xhrTheFunction”] is somehow better than [a onclick=”xhrTheFunction”].

Comment by Anonymous — May 18, 2007

Yes, exactly, is it April 1st?

Comment by Bertrand Le Roy — May 18, 2007

it’s sounds like reinventing the wheel ..

Comment by Alex — May 18, 2007

That isn’t unobtrusive.

Comment by Greg — May 18, 2007

just think about perfomance, when that automation script needs to parse all your DOM to find all event handlers

Comment by Anonymous — May 18, 2007

And how about stopping the observer? May be difficult, since prototype only unregisters observers when passing the same function reference.

No thanks, I’ll take care of events myself.

Comment by Jelle — May 18, 2007

Funny pattern, maybe he should think a bit more about it. Behaviours should not be inline, since its the idea behind behaviours is to split view and controller. Also selectors that only work with classname w/o tag are slower than both tag and classname combined.

Comment by digitarald — May 18, 2007

Haha, this is ridiculous.

Next step :


JS :

Comment by Country — May 18, 2007

Is this really worth a headline on Ajaxian?

[Yes] [No]

I click on yes, hoping that the click handler is listening to me.

Comment by Andreas Kalsch — May 18, 2007

Hmm, not something I would use in an application, I try to stay away from using the class attribute for anything except styles.

Comment by Jeffrey Robbins — May 18, 2007

The power of behaviors is that it attaches javascript to DOM elements… not just onClick behaviors, but anything. Behaviors can do anything at init time (move stuff around in the DOM, anything), attach to multiple keyboard/mouse events, etc. And behaviors can be object oriented so you can have a mouseover event and a mouseout event tied to the same object that that also does loading stuff at init time.

Comment by Warren Konkel — May 18, 2007

This was just a proof of concept (and not even entirely functional). The idea was to parse the DOM all in one shot, so if you have a ton of behaviors, you don’t have to deal with alot of selector rules. You could add other naming conventions to automate common tasks, do binding, etc.

It is verbose, inefficient, not original or entirely unobstrusive, and probably not worthy of a spotlight on ajaxian :O

Comment by Gabriel Handford — May 18, 2007

Sorry for all the pooh pooh Gabe. I thought it looked interesting and so submitted it without your consent. ..Err next time maybe I’ll just let you do it. :/

(but hey at least you got some more hits – even if they were angry pooh pooh hits ;) )

Comment by Jesse Kuhnert — May 18, 2007

Leave a comment

You must be logged in to post a comment.