I am implementing a form of a publisher / customer design pattern in jQuery. I'm basically creating classes using javascript in a capscript, which works as components of my page. Ie navigation, datalists, etc.
Instead of having fire incidents of DOM elements, I have examples of these classes that trigger themselves to send custom events. These examples can listen to each other and based on changes in each other's behavior, they can update the DOM elements accordingly!
I know this thing because I have a component that has correctly sent custom events. However, I have run into a problem I have made another component and for my life, I can not understand why this incident has not happened.
This is the implementation of my class:
window list = (function () {List = function (element, settings) {var _a, _b, _c; List = $ (element); this.settings = jQuery.extend (list.DEFAULTS, settings); this link = this.list.find (this.settings.link_selector); this.links.selectable (); _b = [selectableEvent .compLETED, SelectableEvent.UNDONE, SelectableEvent.SSELECTED, SelectableEvent.DESELECTED] for (_a = 0, _c = _b.length; _a & lt; _c; _a ++) {(function () {var incident_type = _b [_a ]; Return this return.links.bind (event_type, __bind (function (event, selectable_event) {return.dispatch (selectable_event));}, this));}) Call (this);} return it;} list. Defaults = {link_selector: "a", completed_selector: ".completed"}} Lis T.prototype.change = function (mode, previous_mode) {if (mode! == this.mode) {this.mode = mode; If (previous_mode) {this.list.removeClass (previous_mode); } Return this return.list.addClass (this.mode); }}; List.prototype.length = function () {return.links.length; }; List.prototype.remaining = function () {return.length () - this.list.find (this.settings.completed_selector). Length; }; List.prototype.dispatch = function (selectable_event) {$ (this) .trigger (selectable_event.type, selectable_event); Return warning (selectable_event.type); }; Return list; .}) Call (this);
Note:
list.prototype.dispatch = function (selectable_event) {$ (this) .trigger (selectable_event.type, selectable_event); Return warning (selectable_event.type); };
This code has been correctly triggered and returns the expected event type via a warning. But there is a possibility of a custom event triggered before the warning. This is where I am facing my problem.
$ (document) .ready (function () {var list_change_handler, todo_list; todo_list = new list ("ul.tasks"); list_change_handler = $ (Todo_list) .bind (SelectableEvent.COMPLETED $ (Todo_list) .bind (selectableEvent.UNDONE, list_change_handler); $ (todo_list) function (event, sabel_events) {return warning ("hooray!"); .bind (selectableEvent.SELECTED, list_change_handler); $ ( Todo_list) .bind (SelectableEvent.DESELECTED, list_change_handler);}
You can see here that "Hurray" is the warning that I have to set fire but unfortunately I have no luck here. Ironically, I have another class Has done similar work with the way a custom event has been sent and the listener is receiving it properly. Any ideas why this will not work?
Update:
To discuss the comments, it seems that "this" logging in the console represents the JS object C girl. But logging "$ (this)" gives an empty jQuery object, thus triggering Will never be removed D. "This" is returning the example of the class correctly, so why any thoughts on $ (this) is coming empty?
I found that jQuery could not point to its object because class has its own version of a jQuery method Has implemented. In this case, by changing the length () method length () method () changed the problem completely, and any instance of the class could successfully trigger events.
Comments
Post a Comment