【问题标题】:Event delegation for objects; How to listen for events?对象的事件委托;如何监听事件?
【发布时间】:2014-08-06 04:43:15
【问题描述】:

如何监听 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");

但我无法触发事件。

【问题讨论】:

标签: javascript jquery


【解决方案1】:

尝试:

用 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(); 附加一个侦听器更有利。

【讨论】:

  • 在这里工作,但不在我的骨干项目中,这是我打算回答的问题。在主干中,您可以使用app.vent = _.extent({}, Backbone.events); 创建通风口。在那里,您不需要将应用程序引用为 jquery 对象,即。您可以只使用app.trigger() 而不是$(app).trigger(),因此我很困惑。既然您在阅读时回答了我的问题; +1 并接受答案。但是,如果您使用的是骨干网:我会问另一个问题并链接到它。
  • @agconti,我不是骨干专家,但我想我知道答案。
  • 嘿meni,我更新了,你的回答是我如何让它在我的应用程序中工作。
  • 这是一种无耻的插件,但我创建了Beacon 作为一种与 DOM 分离的应用程序级事件的方法。搜索 GitHubBower 也可以找到替代方案。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-05-06
  • 2013-09-05
  • 2011-09-30
  • 2012-05-13
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多