Question

我想知道如何将一个事件监听器附加到一个变量......我知道这听起来很奇怪所以这就是我正在使用的东西。

B.viewController = function() {
  var view = 'large';

  var update = function() {
    if($(window).width() >= 481) {
      var new-view = 'large';
      return view == new-view
    } else {
      var new-view = 'mobile';
      return view == new-view;
    }
  }

  update();

  $(window).resize(function() {
    update();
  });
};

现在我想扩展它，以便我可以将它作为事件监听器附加，所以例如我可以使用它来做类似coolImage.bind（'B.viewController'，回调）的事情所以如果视图改变了调用回调而不必将调整大小监听器附加到窗口...

Answer 1

对于HTML元素的事件：我会写一个很大的Listener类。它将具有将自身绑定到元素的功能。此函数将监听器的内部方法绑定为所有元素事件的回调函数，如onload，onclick等。然后，您将为不同类型的侦听器实例化监听器，将实际函数分配给监听器内部方法。另一种选择是将所有这些事件绑定到单个回调函数，这将获得单个参数 - 事件描述。如果我没记错的话，IE并不总是发送该参数 - 如果这是真的，你应该看window.event。在此功能中，您将处理完成的所有事件。如果您仍想识别发生了哪个事件，可以通过保存事件详细信息的对象类型来实现。

对于变量事件：我没有遇到过这样的事情。它在大多数编程语言中都不存在，我认为它不存在于javascript中。我建议使用好的旧OOP练习 - 吸气剂和二传手。因此，您将编写a.set(x)而不是a = x和a.getX()而不是a.x，并且在这些方法中，您可以根据需要处理更改。

Answer 2

您可能希望自定义事件来完成这项工作。

以下是一个例子：

var Publisher = {}, Subscriber = {}, EVENT_NAME = 'publisher.updated',
    PubSub = $({});

Publisher.update = function() {
    PubSub.trigger(EVENT_NAME);
};

Subscriber.onUpdate = function() {
    alert('Received update!');
};

PubSub.bind(EVENT_NAME, Subscriber.onUpdate);
Publisher.update();

发布者在调用更新时触发事件，订阅者在触发事件时侦听事件。

将此应用于您的案例，更新B.viewController后，您可以调用PubSub.trigger('view.updated')来触发更新事件。然后，让coolImage通过PubSub.bind('view.updated', coolImage.onViewUpdated)收听该事件。

信用卡/参考

PubSub代码的JSFilddle：http://jsfiddle.net/cwZZE/17/
PubSub的想法来自Ben Alman的Tiny Pub / Sub图书馆：https://gist.github.com/799721/c119783954e1b10551c4afef53b2c04fefcb7465

javascript中的valuechange事件？

2 个答案: