Handling text selection event in Firefox extension (preventing user from selecting text)
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 accomplishes this will be fine as well. (The idea behind getting the selection event was just to preventDefault()
or otherwise getSelection().remove开发者_JS百科AllRanges()
)
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.
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;
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);"/>
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;
}
精彩评论