.ondragstart is not equivalent to .addEventListener ("dragstart"

I want to make the img element inexpressible and unraggable because I use it as a window size control (clicking and dragging around the surrounding div resizes the window).

It works great as below:

noSelect[x].ondragstart = function() {return false}; 

But since this will be used in the firefox extension (3.6. *), Which uses an XPCNativeWrapper around each HTMLE element, I cannot use ".ondragstart" and must use ".addEventListener"

The problem is equivalent to the code above, does not work. Clicking and dragging img starts dragging the default image of firefox, instead of resizing my window in the following:

 noSelect[x].addEventListener("dragstart", function () {return false}, false) 

Are the two lines of code above not equivalent?

Full context for non-selectable objects:

 var noSelect = document.getElementsByClassName("noSelect") for (x in noSelect) { if (x == "length") break noSelect[x].unselectable = "on"; noSelect[x].onselectstart = function(){return false}; noSelect[x].ondragstart = function() {return false}; noSelect[x].style.userSelect = "none"; // w3c standard noSelect[x].style.MozUserSelect = "none"; // Firefox } 
+6
javascript javascript-events dom-events firefox-addon drag-and-drop
source share
3 answers

addEventListener registers an EventListener that does not have special handling of return code.

Returning false from most on* event handlers cancels the event according to the HTML specification , in a regular EventListener this is achieved by calling event.preventDefault() as Neil mentioned in his answer.

+5
source share
  • ondragstart is an event only for IE, why it doesnโ€™t shoot Fire Fox. UPDATE : it's harder than here, read here: Javascript ondrag, ondragstart, ondragend
  • if ondragstart was available in FF, you can catch it x.ondragstart = ..., it works in FF too.
  • addEventListener is the best way to assign event handlers; it allows you to attach more than one event handler to an element. IE has an equivalent sorf type called attachEvent.

About your problem: in browsers other than IE, to make the object inaccessible, you need to catch the onmousedown event and prevent the default behavior.

+1
source share

I do not know why function() { return false; } function() { return false; } does not work, but I know that function(event) { event.preventDefault(); } function(event) { event.preventDefault(); } will work in Firefox.

+1
source share

All Articles