Skip to content

Instantly share code, notes, and snippets.

@mauriciosoares
Created March 25, 2014 14:12
Show Gist options
  • Save mauriciosoares/9762678 to your computer and use it in GitHub Desktop.
Save mauriciosoares/9762678 to your computer and use it in GitHub Desktop.
Creating custom events with jQuery
// I'm not using any pattern here, for the sake of simplicity :)
// remember, it needs jquery
'use strict';
 
var app = {};
 
app.appView = function() {
  // gets new class and attatchs an custom event to it
  var newClass = new app.myNewClass();
  newClass.on('customEvent', this.onCustomEvent.bind(this));
}
 
app.appView.prototype.onCustomEvent = function(event, params) {
  console.log(event);
  console.log(params);
}
 
app.myNewClass = function() {
  this.emitter = $({});
  // this.on receives the jquerys ON event
  this.on = this.emitter.on.bind(this.emitter);
 
  // this is a little trick, waits a little bit to execute the trigger,
  // so in the appView class can create the "onCustomEvent" method
  // before the trigger is executed, otherwise no callback will be called
  setTimeout(function() {
    this.execEmit();
  }.bind(this), 50)
}
 
app.myNewClass.prototype.execEmit = function() {
  this.emitter.trigger('customEvent', {yeah: 'Hell Yeah!'});
}
 
// kicks everything off
new app.appView();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment