ansaurus

Question

Answer 1

+1 A:

add the following to your field tags:

#ondragstart is for IE, onmousedown is for firefox
ondragstart="return false" onmousedown="return false"

avguchenko 2009-10-19 15:57:57

There's also `onselectstart` which may be useful.

DisgruntledGoat 2009-10-19 17:31:24

For firefox this is not enough (too much, actually), it totally disables mouse usage on a given input field. You can not even select it. Onselectstart is not good enough too. So, still no solution for firefox - for IE ondragstart does the right thing.

maniek 2009-10-20 07:58:08

Answer 2

+2 A:

For archival purposes:

<body ondragstart="return false" draggable="false"
        ondragenter="event.dataTransfer.dropEffect='none'; event.stopPropagation(); event.preventDefault();"  
        ondragover="event.dataTransfer.dropEffect='none';event.stopPropagation(); event.preventDefault();"  
        ondrop="event.dataTransfer.dropEffect='none';event.stopPropagation(); event.preventDefault();"
>

does what I wanted. You can add the ondrag* handlers to form elements, too, like <input ondragenter=...>

reference url: https://developer.mozilla.org/En/DragDrop/Drag_Operations

maniek 2009-10-20 09:45:49

onmousedown="return false;" also works on firefox/chrome afaik... might be wrong... Note that the "Devil" might not do the same thing.

ItzWarty 2010-04-13 17:57:00

Answer 3

+2 A:

This code will work in all versions of Mozilla and IE.

function preventDrag(event)
{
 if(event.type=='dragenter' || event.type=='dragover' || //if drag over event -- allows for drop event to be captured, in case default for this is to not allow drag over target
    event.type=='drop') //prevent text dragging -- IE and new Mozilla (like Firefox 3.5+)
 {
  if(event.stopPropagation) //(Mozilla)
  {
   event.preventDefault();
   event.stopPropagation(); //prevent drag operation from bubbling up and causing text to be modified on old Mozilla (before Firefox 3.5, which doesn't have drop event -- this avoids having to capture old dragdrop event)
  }
  return false; //(IE)
 }
}

//attach event listeners after page has loaded
window.onload=function()
{
 var myTextInput = document.getElementById('textInput'); //target any DOM element here

 if(myTextInput.addEventListener) //(Mozilla)
 {
  myTextInput.addEventListener('dragenter', handleEvents, true); //precursor for drop event
  myTextInput.addEventListener('dragover', handleEvents, true); //precursor for drop event
  myTextInput.addEventListener('drop', preventDrag, true);
 }
 else if (myTextInput.attachEvent) //(IE)
 {
  myTextInput.attachEvent('ondragenter', preventDrag);
  myTextInput.attachEvent('ondragover', preventDrag);
  myTextInput.attachEvent('ondrop', preventDrag);
 }
}

Brady 2010-04-12 20:51:30

ansaurus

tags:

views:

answers:

disable text drag and drop

related questions