在jQuery中使用“class / object”MooTools风格的事件

时间:2010-04-12 20:17:53

标签: javascript jquery javascript-events mootools

MooTools的一个好处是它可以让你轻松地为对象分配/触发事件,例如:

var playerSingleton = new (new Class({
  Implements: [Events],

  initialize: function() {},

  setVolume: function() { 
    // do some stuff..
    this.fireEvent('volumeChanged')
  }

}));

// Somewhere else...

playerSingleton.addEvent('volumeChanged', function() {
  // do something when volume changes
});

playerSingleton.setVolume(75);
// bam our event fires.

如何用jQuery完成这样的事情? 我知道有.bind.trigger,但似乎唯一的方法是将事件绑定/触发到窗口对象:

$(window).bind('volumeChanged', fn);

还有什么比这更好的,更像是MooTools的做法?谢谢!

1 个答案:

答案 0 :(得分:4)

jQuery的bind和trigger似乎适用于普通对象。没有看到源代码,看它是如何工作的(如果它是公共API的一部分),但确实如此。请参阅去年的this discussion,探讨相同的想法。

播放器是常规对象,具有设置音量的方法,并添加音量变化的侦听器。 an example here

var player = {
    setVolume: function() {
        $(this).trigger("volumeChanged");
    },

    addVolumeChangeHandler: function(fn) {
        $(this).bind("volumeChanged", fn);
    }
};

// add a listener
player.addVolumeChangeHandler(function() {
    alert("volume has been changed");
});

// change volume (should fire the attached listener)
player.setVolume(); // alerts "volume has been changed"