jQuery: Pourquoi ne pas déclencher le feu d'un objet JS?

Question

Je suis mis en œuvre une forme d'un modèle de conception éditeur / abonné dans jQuery. Je suis essentiellement la construction des classes en Javascript utilisant CoffeeScript qui servent de composants sur ma page. à-dire la navigation, DataList, etc.

Au lieu d'avoir des éléments DOM des événements d'incendie, je instances de ces classes qui utilisent trigger sur eux-mêmes pour envoyer des événements personnalisés. Ces instances peuvent alors écouter les uns aux autres et peuvent mettre à jour les éléments DOM qu'ils possèdent en conséquence en fonction des changements dans chaque comportement des autres!

Je sais que cela fonctionne comme je l'un de mes composants dispatching un événement personnalisé correctement. Cependant, je suis tombé sur un accroc. J'ai créé un autre composant et pour la vie de moi je ne peux pas comprendre pourquoi il est l'événement ne soit tiré.

Ceci est la mise en œuvre de ma classe:

window.List = (function() {
    List = function(element, settings) {
      var _a, _b, _c;
      this.list = $(element);
      this.settings = jQuery.extend(List.DEFAULTS, settings);
      this.links = this.list.find(this.settings.link_selector);
      this.links.selectable();
      _b = [SelectableEvent.COMPLETED, SelectableEvent.UNDONE, SelectableEvent.SELECTED, SelectableEvent.DESELECTED];
      for (_a = 0, _c = _b.length; _a < _c; _a++) {
        (function() {
          var event_type = _b[_a];
          return this.links.bind(event_type, __bind(function(event, selectable_event) {
            return this.dispatch(selectable_event);
          }, this));
        }).call(this);
      }
      return this;
    };
    List.DEFAULTS = {
      link_selector: "a",
      completed_selector: ".completed"
    };
    List.prototype.change = function(mode, previous_mode) {
      if (mode !== this.mode) {
        this.mode = mode;
        if (previous_mode) {
          this.list.removeClass(previous_mode);
        }
        return this.list.addClass(this.mode);
      }
    };
    List.prototype.length = function() {
      return this.links.length;
    };
    List.prototype.remaining = function() {
      return this.length() - this.list.find(this.settings.completed_selector).length;
    };
    List.prototype.dispatch = function(selectable_event) {
      $(this).trigger(selectable_event.type, selectable_event);
      return alert(selectable_event.type);
    };
    return List;
}).call(this);

Faites attention à:

List.prototype.dispatch = function(selectable_event) {
    $(this).trigger(selectable_event.type, selectable_event);
    return alert(selectable_event.type);
};

Ce code est déclenché correctement et renvoie le type d'événement attendu par une alerte. Mais avant que l'alerte ne devrait déclencher un événement personnalisé sur elle-même. C'est là je rencontre mon problème.

$(document).ready(function() {
    var list_change_handler, todo_list;
    todo_list = new List("ul.tasks");
    list_change_handler = function(event, selectable_event) {
      return alert("Hurray!");
    };
    $(todo_list).bind(SelectableEvent.COMPLETED, list_change_handler);
    $(todo_list).bind(SelectableEvent.UNDONE, list_change_handler);
    $(todo_list).bind(SelectableEvent.SELECTED, list_change_handler);
    $(todo_list).bind(SelectableEvent.DESELECTED, list_change_handler);
}

Vous voyez ici l'alerte « Hourra » est ce que je veux tirer, mais malheureusement j'ai pas de chance ici. Ironie du sort, je l'ai fait exactement la même chose avec une autre classe mise en œuvre de la même manière l'envoi d'un événement personnalisé et l'auditeur reçoit-il très bien. Des idées sur pourquoi cela ne fonctionnerait pas?

Mise à jour:

Par la discussion dans les commentaires, il semble que la journalisation « ce » dans la console retourne l'objet JS représentant la classe. Mais l'exploitation forestière « $ (this) » retourne un objet vide jQuery, ce déclencheur ne serait jamais tiré. Toute réflexion sur pourquoi $ (ce) est à venir vide quand « ce » est de retour avec précision l'instance de la classe?

Answer 1

J'ai découvert que jQuery pourrait ne pas indexer mon objet parce que la classe mis en œuvre sa propre version d'une méthode jQuery. Dans ce cas, la longueur (). Renommant la méthode longueur () au total () complètement résolu le problème et toute instance de la classe peut déclencher avec succès des événements.