Event

A good old fashioned events with new skool handling. Shortcuts exist for:

• click
• load
• touchstart
• touchmove
• touchend
• touchcancel
• gesturestart
• gesturechange
• gestureend
• orientationchange

on

Registers a callback function to a DOM event on the element collection.

syntax

x$( 'button' ).on( type, fn );

or

x$( 'button' ).click( fn );

arguments

• type String is the event to subscribe (e.g. load, click, touchstart, etc).
• fn Function is a callback function to execute when the event is fired.

example

x$( 'button' ).on( 'click', function(e) {
    alert('hey that tickles!');
});

or

x$(window).load(function(e) {
  x$('.save').touchstart( function(evt) { alert('tee hee!'); }).css(background:'grey');
});

un

Unregisters a specific callback, or if no specific callback is passed in, unregisters all event callbacks of a specific type.

syntax

Unregister the given function, for the given type, on all button elements:

x$( 'button' ).un( type, fn );

Unregisters all callbacks of the given type, on all button elements:

x$( 'button' ).un( type );

arguments

• type String is the event to unsubscribe (e.g. load, click, touchstart, etc).
• fn Function is the callback function to unsubscribe (optional).

example

// First, create a click event that display an alert message
x$('button').on('click', function() {
    alert('hi!');
});

// Now unsubscribe all functions that response to click on all button elements
x$('button').un('click');

or

var greeting = function() { alert('yo!'); };

x$('button').on('click', greeting);
x$('button').on('click', function() {
    alert('hi!');
});

// When any button is clicked, the 'hi!' message will fire, but not the 'yo!' message.
x$('button').un('click', greeting);

fire

Triggers a specific event on the xui collection.

syntax

x$( selector ).fire( type, data );

arguments

• type String is the event to fire (e.g. load, click, touchstart, etc).
• data Object is a JSON object to use as the event's data property.

example

x$('button#reset').fire('click', { died:true });

x$('.target').fire('touchstart');

ready

Event handler for when the DOM is ready. Thank you domready!

syntax

x$.ready(handler);

arguments

• handler Function event handler to be attached to the "dom is ready" event.

example

x$.ready(function() { alert('mah doms are ready'); });

xui.ready(function() { console.log('ready, set, go!'); });