How can I disable text selection using shift without disabling all text selection?
That will bind on document an event where it disables text selection upon pressing DOWN shift
document.onkeydown = function(e) {
var keyPressed = e.keyCode;
if (keyPressed == 16) { //thats the keycode for shift
$('html').css({'-moz-user-select':'-moz-none',
'-moz-user-select':'none',
'-o-user-select':'none',
'-khtml-user-select':'none',
'-webkit-user-select':'none',
'-ms-user-select':'none',
'user-select':'none'
}); //or you could pass these css rules into a class and add that class to html instead
document.onkeyup = function() {
//here you remove css rules that disable text selection
}
}
}
Hopefully i have helped you.
Based on comments
document.onkeydown = function(e) {
var keyPressed = e.keyCode;
if (keyPressed == 16) { //thats the keycode for shift
$('html').addClass('unselectable'); //unselectable contains aforementioned css rules
document.onkeyup = function() {
$('html').removeClass('unselectable'); //and simply remove unselectable class making text selection availabe
}
}
}
Another solution you might consider: instead of preventing text selection by watching for shift keys and toggling selectability, you could just clear the text selection.
window.getSelection().removeAllRanges();
I find this more convenient because it can be run in your click handler to "cancel" the default behavior. Appears to work in IE 9+ and other modern browsers.