Question

whenever i alter the onmousemove or onmouseup attributes of the document, for example:

document.onmousemove = myOnMouseMove;

document.onmouseup = myOnMouseUp;

It prevents me from selecting text in any input type=’text’ or textarea elements in internet explorer (have tried in ie7 and ie8, fine in firefox). If I remove either of these it allows me to select text again, but i really need both to make my home made drag and drop functionality work elsewhere on the page.

Is there some way i can retain the default functionality of the onmouseXXX functions and attach my function onto the end? Or is there a better way to be doing this?

I also have the same problem using the onkeyup attribute of a textarea forcing the flashing text cursor to the end of the text.

Thanks

Answer 1

You should be fine so long as you don’t return false from your event handler functions or mess with the user selection. Alternatively, you could check the event’s target in the event handler to filter out <input>s and <textarea>s:

document.onmousedown = function(evt) {
    evt = evt || window.event;
    var target = evt.target || evt.srcElement;
    var tagName = target.nodeName.toLowerCase();
    if (tagName == "input" || tagName == "textarea") {
        // Do nothing
    } else {
        // Do your stuff
    }
};