How can I deselect text using Javascript or jQuery?

Question

I have a draggable (jQuery UI) element with \"canceled\" text on it. Here\'s what I mean:

$(\'#main\').draggable({
        cancel: \'#main>* *\',
        star         


        

Answer 1

To deselect everything you can use:

document.getSelection().removeAllRanges();

Answer 2

Clear document selection document.selection.empty();

Something like:

 $('#main').draggable({
     cancel: '#main>* *',
     start: function(){
      // deselect text
      document.selection.empty();
     }
 });

Answer 3

jQuery UI now includes .disableSelection(), which you can use to prevent the text inside your elements from being selected. The API documentation on it isn't hugely useful, but: http://api.jqueryui.com/disableSelection/

As an aside, Eric G's answer proved supremely helpful for me when creating my own "text highlighting" tool - as Lawrence remarked, it won't throw out an error if no text has been selected.