How to Disable Text Selection Using Jquery

How to disable text selection using jQuery?

In jQuery 1.8, this can be done as follows:

(function($){
    $.fn.disableSelection = function() {
        return this
                 .attr('unselectable', 'on')
                 .css('user-select', 'none')
                 .on('selectstart', false);
    };
})(jQuery);

How to disable text selection via jQuery?

Try that http://code.jdempster.com/jQuery.DisableTextSelect/jquery.disable.text.select.js

How to disable text selection on a table in a tricky situation?

You can't use select() event because it is limited to input elements.

Instead, try preventDefault() on the selectstart event...

$('tr').bind('selectstart', function(event) {
    event.preventDefault();
});

jsFiddle.

Alternatively, you can use CSS...

tr {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

How to disable text selection using jQuery Splitter

There was an issue with previous versions of jQuery Splitter and selecting text in the left pane but it was solved in recent version.

Javascript/Jquery Syntax to Disable Text Selection on a Div AND all Child Elements?

This works for me:

$('#MyContent').children().each(function(i, c) {
    disableSelection(c);
});

function disableSelection(target) {
    console.debug(target);

    if (typeof target.onselectstart != "undefined")             // For IE
        target.onselectstart = function() { return false };
    else if (typeof target.style.MozUserSelect != "undefined")  // For Firefox
        target.style.MozUserSelect = "none";
    else                                                        // All other routes (Opera, etc.).
        target.onmousedown = function() { return false };

    target.style.cursor = "default";
}

Demo : http://jsfiddle.net/9vLFD/4/

JavaScript: Disable text selection via doubleclick

I fear you can't prevent the selection itself being "native behavior" of the browser, but you can clear the selection right after it's made:

<script type="text/javascript">
document.ondblclick = function(evt) {
    if (window.getSelection)
        window.getSelection().removeAllRanges();
    else if (document.selection)
        document.selection.empty();
}
</script>

Edit: to also prevent selecting whole paragraph by "triple click", here is the required code:

var _tripleClickTimer = 0;
var _mouseDown = false;

document.onmousedown = function() {
    _mouseDown = true;
};

document.onmouseup = function() {
    _mouseDown = false;
};

document.ondblclick = function DoubleClick(evt) {
    ClearSelection();
    window.clearTimeout(_tripleClickTimer);

    //handle triple click selecting whole paragraph
    document.onclick = function() {
        ClearSelection();
    };

    _tripleClickTimer = window.setTimeout(RemoveDocumentClick, 1000);
};

function RemoveDocumentClick() {
    if (!_mouseDown) {
        document.onclick = null; 
        return true;
    }

    _tripleClickTimer = window.setTimeout(RemoveDocumentClick, 1000);
    return false;
}

function ClearSelection() {
    if (window.getSelection)
        window.getSelection().removeAllRanges();
    else if (document.selection)
        document.selection.empty();
}

Live test case.

Should be cross browser, please report any browser where it's not working.

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
    }
  }
}

How to disable text selection on touch press?

Use this in your CSS..

 -webkit-touch-callout: none; /* Safari */
        -webkit-user-select: none; /* Chrome */     
           -moz-user-select: none; /* Firefox */
            -ms-user-select: none; /* Internet Explorer/Edge */
                user-select: none;

How can I disable text selection on a jquery draggable?

Check this demo sources, for example:

$("#sortable").disableSelection();

edit
A post from jquery forum explaining the situation around disableSelection. Looks like it's 'undocumented' for a long time already.

Debug and Get around Disable Text Selection on Webpage

They are calling .disableSelection(). They just aren't calling it as you worded it. Below is a direct copy/paste from the source of the website.

Line 629 if you click "view source"

$(document).on('click', '.thumbActions button', thumbHandler).disableSelection();

Check out this part of the documentation on .disableSelection():

"Disabling text selection is bad. Don't use this."

The following code (also taken directly from the website's source) should make the way it actually works more obvious.

(function($){
    $.fn.disableSelection = function() {
        return this.attr('unselectable', 'on').css('user-select', 'none').on('selectstart', false);
    };
    $.fn.enableSelection = function() {
        return this.attr('unselectable', 'off').css('user-select', 'all').on('selectstart', true);
    };
})(jQuery);

It is setting the CSS rule user-select to none or all, depending on what should or shouldn't be selectable. At first I thought it was because of the HTML unSelectable attribute, but after actually trying it it doesn't appear to do anything. Maybe it's an IE only thing.
user-select definitely works though.