对象的事件委托;如何倾听事件

Event delegation for objects; How to listen for events?

本文关键字:事件 倾听 何倾听 对象      更新时间:2023-09-26

如何侦听javascript对象上的自定义事件?我正在尝试在触发事件后激发应用程序级对象的方法,但与DOM元素不同,我无法注册对象的侦听器。

如何构建应用程序以侦听触发的事件,然后执行操作?

js:

$(document).ready(function(){
  var app = {};
  app.doStuff = function(){ alert("Yo!");};
  $(app).on("myCustomEvent", function(){
    alert("doing stuff");
    app.doStuff();
  });
  $("body").on('click', "#trigger", function(){
    alert("triggered");
    $(this).trigger("myCustomEvent");
  });
});

在jsbin中重新生成:http://jsbin.com/zopubuso/1/edit

这背后的原因

我正在创建一个主干应用程序,其中app对象中有一个全局事件通风口。我试图通过触发事件来交流观点:

即。

app.on("myEvent", MyView.model.doStuff);
app.trigger("myEvent");

但我无法启动活动。

try:

jquery触发器:

$(app).trigger("myCustomEvent");

http://jsfiddle.net/9w8A5/

触发骨干事件:

首先,您需要使用Backbone.Events:扩展对象

var app = {};
_.extend(app, Backbone.Events); // underscore.js '_.extend', We can also use jquery '$.extend()'
... on("myCustomEvent")...
app.trigger("myCustomEvent");

演示:http://jsfiddle.net/A5484/1/


更新自agconti。

以下是一种在主干网中完成附加事件的简单方法:

var app = _.extend({}, Backbone.Events);
var myView = Backbone.View.extend({
    initialize: function(){
        ... other configuration stuff ...
        app.on( "myCustomEvent", function(){
            this.doStuff();
        }, myView);
    },
    doStuff: function(){ alert("Yo!"); }
});
app.trigger('myCustomEvent');

*使用主干的事件对象比像我试图做的那样用app.on();附加侦听器更有优势。