2. Brandon Aaron
jQuery Core Contributor
Principal Technologist at Nokia
http://brandonaaron.net/
http://twitter.com/brandonaaron
3. Why so special?
• Override existing events
• Normalize existing events
• Enhance existing events
• Create new events
• Use just like other events
4. setup and teardown
• Runs once per an event type per an element
• return false; to tell jQuery to handle the
event binding instead
• Available since 1.2.2
jQuery.event.special.tripleclick = {
setup: function(data, namespaces) {
var elem = this;
},
teardown: function(namespaces) {
var elem = this;
}
};
http://brandonaaron.net/blog/2009/03/26/special-events
5. jQuery.event.special.tripleclick = {
setup: function(data, namespaces) {
var elem = this, $elem = jQuery(elem);
$elem.bind('click', jQuery.event.special.tripleclick.handler);
},
teardown: function(namespaces) {
var elem = this, $elem = jQuery(elem);
$elem.unbind('click', jQuery.event.special.tripleclick.handler);
},
handler: function(event) {
var elem = this, $elem = jQuery(elem), clicks = $elem.data('clicks') || 0;
clicks += 1;
if ( clicks === 3 ) {
clicks = 0;
// set event type to "tripleclick"
event.type = "tripleclick";
// let jQuery handle the triggering of "tripleclick" event handlers
jQuery.event.handle.apply(this, arguments)
}
$elem.data('clicks', clicks);
}
};
7. add and remove
• Runs once for every event handler added
• Has the ability to change the event handler,
data, and namespaces
• Available since 1.4.2 (technically since 1.4 but changed in 1.4.2)
http://brandonaaron.net/blog/2009/06/4/jquery-edge-new-special-event-hooks
http://brandonaaron.net/blog/2010/02/25/special-events-the-changes-in-1-4-2
8. jQuery.event.special.multiclick = {
add: function( details ) {
var handler = details.handler,
data = details.data,
namespace = details.namespace;
},
remove: function( details ) {
var handler = details.handler,
data = details.data,
namespace = details.namespace;
}
};
9. jQuery.event.special.multiclick = {
add: function( details ) {
var handler = details.handler,
data = details.data,
threshold = data && data.threshold || 1,
clicks = 0;
// replace the handler
details.handler = function(event) {
// increase number of clicks
clicks += 1;
if ( clicks === threshold ) {
// required number of clicks reached, reset
clicks = 0;
// call the actual supplied handler
handler.apply( this, arguments );
}
};
},
setup: function( data, namespaces ) {
jQuery( this ).bind( "click", jQuery.event.special.multiclick.handler );
},
teardown: function( namespaces ) {
jQuery( this ).unbind( "click", jQuery.event.special.multiclick.handler );
},
handler: function( event ) {
// set correct event type
event.type = "multiclick";
// trigger multiclick handlers
jQuery.event.handle.apply( this, arguments );
}
};
Contributing since Aug 2006
Contribute number of plugins like Live Query and bgiframe
Maintain a blog to share knowledge
Nokia in March as a senior technologist to explore the mobile web
Nokia investing significantly in web technologies