Is it ok to bind jQuery events to plain, non-DOM Javascript objects:
var myobject = {};
$(myobject).bind(\"foobar\", function() { alert(\"daa\"); });
$(myobject
Instead of using the jquery event system, I would implement one that mimics it using the jQuery.Callbacks method.
var myClass = function(){
this._callbacks = {};
};
myClass.prototype = {
addEvent: function(evname,callback) {
if (!this._callbacks[evname]) {
this._callbacks[evname] = $.Callbacks();
}
this._callbacks[evname].add(callback);
},
removeEvent: function(evname) {
if (!this._callbacks[evname]) {
return;
}
this._callbacks[evname].remove();
//Might need this too:
//this._callbacks[evname] = null;
},
triggerEvent: function(evname) {
if (this._callbacks[evname]) {
this._callbacks[evname].fire();
}
}
};
var foo = new myClass();
foo.addEvent("foo",function(){
console.log('foo');
});
foo.triggerEvent("foo");
foo.removeEvent("foo");
// event was removed, the below line won't do anything.
foo.triggerEvent("foo");
http://jsfiddle.net/kEuAP/
However, to answer your question, I don't see any immediate problems with what you are doing other than it isn't documented and may change functionality from version to version (although it works in all currently available versions 1.2.6+).
Seeing as jQuery support alteration of object properties via animate also, this is definitely fine.
var obj = {'test':0};
var interval = setInterval(function(){console.log(obj);}, 250);
$(obj).on("fun", function(){this.test++});
$(obj).animate(
{'test':100},
3000,
function (){
console.log(obj);
clearInterval(interval);
$(obj).trigger("fun")
console.log("increment",obj);
}
);
//will console log {test: 1.5}, {test: 6.4} etc then {test: 100}
//and finally "interval" {test: 101}
Quickredfox's backup comment is a pretty good source too: http://forum.jquery.com/topic/triggering-custom-events-on-js-objects