Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Prevent all javascript events from firing

Tags:

javascript

I am working on a firebug like javascript element selector, but cannot figure out how to stop all JavaScript events from firing when clicked. The firebug lite plugin (https://getfirebug.com/firebuglite) is doing exactly what I want, but cannot figure out what they are doing. Any help would be appreciated.

Senario:

  • User selects element inspector
  • User clicks on element
  • onClick, mousedown, mouseup should NOT fire

I have tried the following with no luck:

function stopEvents(el){

    for(var key in window) {
        if (key.indexOf("on") == 0)
            el.addEventListener(key.substr(2), stop, false);
    }
}

function StopEvent(pE)
{
    stopEvents(pE);

    if (!pE)
     if (window.event)
       pE = window.event;
     else
       return;
  if (pE.cancelBubble != null)
    pE.cancelBubble = true;
  if (pE.stopPropagation)
     pE.stopPropagation();
  if (pE.preventDefault)
     pE.preventDefault();
  if (window.event)
     pE.returnValue = false;
  if (pE.cancel != null)
     pE.cancel = true;
}

EDIT:

$('.somediv').on("click", function(e){
     //Stop bubbling and propagation
     StopEvent(e);

     //EDIT: Still not working with this
     e.stopImmediatePropagation();

     //RUN only my code here
     console.log("My code is running still");

     return false;
});

If there is another library such as YUI binding events to the same DOM element. It will fire there event after mine. I cannot seem to hijack the event to stop this from happening.

EDIT:

I cannot use disabled because I need to be able to fire my event. If I did the following, I wouldn't be able to fire the above event. I cannot attach a parent event either because the DOM will stop firing all events on the Tree for that node.

$('.somediv').on("mouseover", function(e){
     $(this).attr("disabled", "disabled"); 
});

EDIT:

The events I want to disable are already created before my script runs. These events could be any javascript library such as YUI, Dojo, jQuery, JavaScript etc...

like image 254
user2832928 Avatar asked Mar 22 '23 05:03

user2832928


1 Answers

Disabling all events on the page is very easy. Hard part is to restore them when needed.

document.body.innerHTML = document.body.innerHTML;

This will effectively remove all events bound to DOM nodes by replacing the DOM with it's "virgin" copy.

Most of the time user won't even notice the redraw.

like image 63
Lex Avatar answered Apr 27 '23 16:04

Lex