Basically I need to know when the window.getSelection()
has changed and bind a handler to this event. Ideas?
OBS: Please note that I'm not looking to bind a selection change on a INPUT or TEXTAREA. I'm talking about any selection in the window.
Basically I need to know when the window.getSelection()
has changed and bind a handler to this event. Ideas?
OBS: Please note that I'm not looking to bind a selection change on a INPUT or TEXTAREA. I'm talking about any selection in the window.
There is no cross-browser way of detecting changes to the selection. IE (since version 5.5, I think) and WebKit/Blink browsers (Chrome, Safari and Opera version from the last couple of years, for example) support a selectionchange
event on the document
which does exactly what you want.
Firefox and pre-Blink Opera have no such event and all you can do is detect selection changes made via keyboard and mouse events, which is unsatisfactory (there is no way of detecting "Select All" from context or edit menus, for example), or simply poll the Selection
object returned by window.getSelection()
(checking the selection's anchorNode
, anchorOffset
, focusNode
and focusOffset
properties against their previous values should be sufficient).
There is no cross-browser event for that.
However, there does exist an event called selectionchange
, which trigger on every change in a selection in the document, but it is only supported in IE and recent WebKit (Chrome/Safari), so no Firefox/Opera.
You can use the selectionchange
event like this:
$(document).on('selectionchange', function(e) {
console.log('selectionchange', e.originalEvent);
});
jsfiddle example
I think it would help
function foo() {
var selObj = window.getSelection();
alert(selObj);
var selRange = selObj.getRangeAt(0);
// work something with selObj
}