jQuery unknown events management

Question

I hope I will be clear enough but my situation and what I want to do a little complicated.

I will start explaining my problem with this jsfiddle

As you can see, there are three nested blocks. The JavaScript code is divided in two parts: the first one is something I can't change (well, in fact I don't want to touch it :x). This script create events on all the blocks, with a "return false" to stop propagation (I have the same problem with "e.stopPropagation").

The other part of the JavaScript is a script I am writing. After pressing enter key, I want to change the behavior of the click: when I click on #b (or #c which is in #b) I want to display "gruik" and only "gruik". To do that, I kill the other "click" events (from the code I can't change) and create my own "click" event.

Now, my real situation: the "code I cannot change" is the highstock library (18,000 lines of code that I don't really want to dig into) which creates some graphics (which is represented by the blocks in my example). I don't really know if they use 'live', 'bind' or 'delegate' and I don't know which block has event attached on (the graph is in several nested blocks).

Now my problem: I kill some events in my example but it is not suitable, for several reasons: I could probably kill (and unbind+undelegate) all "click" events in all the children of the container of my graph, but how could I "revive them" after that? So, a first question: is it possible when killing an event to keep it somewhere to "revive" it?

Another solution would be to create a "top priority" for my own events without killing anybody, but I do not think that is possible in JavaScript.

I hope I have been clear enough :/

PS: a demo of highstock library

score 0 · Answer 1 · edited May 23 '17 at 12:27

First things first, the preferred way of doing this (i.e. disabling event handlers) is to make the event handlers themselves aware of whether they should continue logic or not. Probably through some flag. At least, preferred over bind / unbind and their ilk. If your top code is absolutely not modifiable though, then that's out of the question.

// i.e.
$(element).click(function (e) {
    // bail?
    if (some_flag) { return; }

    // continue...
});

However, it should be possible to get a handle on all event handlers registered for any element using jQuery. With that, you can cache them, unbind, then re-bind when again necessary.

jQuery unknown events management

1 Answers1