javascript - Handling text selection event in Firefox extension (preventing user from selecting text) - Stack Overflow

admin管理员组

文章数量:1291674

I was wondering if in chrome code we have some better way to detect when the user selects/highlights something in the current page than listening for keyup/mouseup and checking window.getSelection(). Any ideas?

edit: Actually, what I'm trying to do is simply preventing the user from selecting any text at all in the contentDocument. Something that acplishes this will be fine as well. (The idea behind getting the selection event was just to preventDefault() or otherwise getSelection().removeAllRanges())

edit2: Please note that I need not just to prevent the highlighting from showing up, but rather the selection from happening.

edit3: I don't need to prevent copying but rather selecting the elements.

I was wondering if in chrome code we have some better way to detect when the user selects/highlights something in the current page than listening for keyup/mouseup and checking window.getSelection(). Any ideas?

edit: Actually, what I'm trying to do is simply preventing the user from selecting any text at all in the contentDocument. Something that acplishes this will be fine as well. (The idea behind getting the selection event was just to preventDefault() or otherwise getSelection().removeAllRanges())

edit2: Please note that I need not just to prevent the highlighting from showing up, but rather the selection from happening.

edit3: I don't need to prevent copying but rather selecting the elements.

• javascript
• firefox
• firefox-addon
• dom-events
• textselection

Share Improve this question Follow edited Jul 14, 2019 at 8:36 Brian Tompsett - 汤莱恩 5,8937272 gold badges6161 silver badges133133 bronze badges asked Mar 6, 2011 at 15:36 CAFxXCAFxX 30.4k66 gold badges4343 silver badges6767 bronze badges 1

• IE and Opera implement the unselectable attribute (btw) – Šime Vidas Commented Mar 6, 2011 at 16:46

Add a ment  | 

6 Answers 6

Sorted by: Reset to default 4

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 ment 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;

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 mand is enabled and disabled by an event. You can get notified of this event by creating a mand updater.

<mandset mandupdater="true" events="select"
            onmandupdate="setTimeout(selectNone, 0);"/>

Add the following code to a css file, which is linked with a <link> tag in your popup html:

*,
*::before,
*::after {
  user-select: inherit;
}

body {
  user-select: none;
}

本文标签：