Question

I’ll try and explain the best I can…

I have a page, we’ll call it pageA. When a button is clicked on that page, an ajax request is sent out and the return data is eval()’d. That data obviously contains javascript code. This code could possibly contain event listeners that are added to pageA when it is eval’d. Something like jquery $(‘body’).click() for example.

When the button on pageA is clicked again, is there a function or something to remove any and all event listeners and data added on that eval.

I am capturing all the data returned from the ajax call into a variable before I eval the data, so is there a way to just do $(data).remove() and have all the event listeners and data magically disappear?

With eval data, it’s not really added to the page per se where I could just do a text remove on the page and have all my problems go away, but the event listeners certainly do stay around.

Any ideas?

Answer 1

I will forgo the lecture on the evils of eval and recommend that you try namespacing your events in jQuery.

http://docs.jquery.com/Namespaced_Events

For example, have can the code in data add all new events with a namespace:

$(node).bind("click.myNameSpace", fn);

And when you want to remove it, you just do $(node).unbind("click.myNameSpace"), of course, that’s assuming you know what elements they were added to. If you don’t know the type of event that was added you can also do $(node).unbind(".myNameSpace") and it will remove all events under your namespace.