When registering event handlers in jQuery, chaining ‘mouseup’ after ‘click’ after ‘focus’ can produce, what is, in my opinion, ugly code:

$ ( elem ) . focus ( function ( ) { ... } ) . click ( function ( ) { ... } ) . mouseup ( function ( ) { ... } ) ;

It really depends on taste; personally I’d prefer a far more intuitive interface which would enable me to specify all event handlers within a single declaration:

$ ( elem ) . events ( { focus : function ( ) { ... } , click : function ( ) { ... } , mouseup : function ( ) { ... } , // Namespaced event: 'mousedown.namespace' : function ( ) { ... } , // Custom event: exit : function ( ) { ... } } ) ;

Made possible with a tiny plugin:

jQuery. fn . events = function ( o ) { for ( var i in o ) { this . bind ( i , o [ i ] ) ; } return this ; } ;

In my opinion this offers a semantically superior means to bind event handlers in jQuery.

Thanks for reading! Please share your thoughts with me on Twitter. Have a great day!