Question

As many browsers do not show tooltips on disabled form elements (as Opera does), I decided to emulate disabled button with jQuery.

When disabling I just set control’s class to disabled and for buttons/submit controls I add an event handler click(function(){return false;})
and I can unbind it later when reenabling the control.

Now the problem is – I need to remove all attached event handlers (click, enter key) from the disabled control, except ‘mouseenter’ and ‘mouseleave’ because I am using a custom jQuery based tooltip which needs those events.
And after re enabling the button, I need to restore all handlers back.

I know that I can store the attached event handlers in $.data() but I have no idea, how to gather all the event handlers except ‘mouseenter’ and ‘mouseleave’.

Can you help me?

Answer 1

try this:

<script>

$(function() {

//Lets attach 2 event handlers to the div
$("#el").click(function(){ alert("click"); });
$("#el").mouseover(function(){ alert("mouseover"); });


//We iterate on the div node and find the events attached to it

$.each($("#el").data("events"), function(i, event) {
    output(i);
    $.each(event, function(j, h) {
      output(h.handler);
      //DO your unbind here if its not a mouse-enter or a mouseleave
    });
  });
});

function output(text) {
    $("#output").html(function(i, h) {
        return h + text + "<br />";
    });
}

</script>

<div id="el" style="width: 200px; height: 200px; border: solid 1px red;">Test</div>
<span id="output"></output>