Handling text selection event in Firefox extension (preventing user from selecting text)

跟風遠走 提交于 2019-12-04 18:57:42

If you put the following scipt in you body, selection will be disabled in Firefox:

<script type="text/javascript">
   document.body.style.MozUserSelect = "none";
   document.body.style.cursor = "default";
</script>

It does not only disable the highlight, it also disables the selection itself. If you try to select an area via mouse or by arrow-keys (clicking an position and navigating with arrow-keys while SHIFT is pressed) and and press STRG+C, nothing happens.

The only selection that works after that change is STRG+A (no selection visible, but STRG+A & STRG+C copys all). It might be possible to avoid that by keyboard-events.


Edit: I saw you comment with link to Mozilla Doc Center and while they write it controls only the appearance, all my tests in Firefox 3.6 show that it affects also the selection, not only the appearance. But it might be changed in future Releases...

In the absence of suitable events such as select and selectstart (which are indeed absent in Firefox, which has the select event but only applies it to form controls), all you can do is use mouse and keyboard events, as you suggested in the question. Preventing the default action of all mousedown events in the document is no good because it will prevent all interactive elements such as links and form elements from working. Instead, you could do something like the following that zaps a selection as it is made using the mouse and keyboard.

It won't prevent selection via "Select All" in the context and edit menus though, since there is no way of detecting those at all in Firefox. If you need to deal with this, polling the selection is your only hope.

function killSelection() {
    window.getSelection().removeAllRanges();
}

document.addEventListener("mousedown", function(evt) {
    document.addEventListener("mousemove", killSelection, false);
}, false);

document.addEventListener("mouseup", function(evt) {
    document.removeEventListener("mousemove", killSelection, false);
}, false);

document.addEventListener("keydown", killSelection, false);

window.addEventListener("blur", function(evt) {
    document.removeEventListener("mousemove", killSelection, false);
}, false);

You can use css

-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
Tim Down

You can use CSS to prevent the user selecting text. See my answer here: How to disable text selection highlighting using CSS?

To set this via JavaScript in Firefox, you can do the following:

document.body.style.MozUserSelect = "-moz-none";

The Copy command is enabled and disabled by an event. You can get notified of this event by creating a command updater.

<commandset commandupdater="true" events="select"
            oncommandupdate="setTimeout(selectNone, 0);"/>
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!