Evitar la selección de texto después de hacer doble clic

Estoy manejando el evento dblclick en un lapso en mi aplicación web. Un efecto secundario es que el doble clic selecciona texto en la página. ¿Cómo puedo evitar que ocurra esta selección?

function clearSelection() {
    if(document.selection && document.selection.empty) {
        document.selection.empty();
    } else if(window.getSelection) {
        var sel = window.getSelection();
        sel.removeAllRanges();
    }
}

También puede aplicar estos estilos al intervalo para todos los navegadores que no sean IE e IE10:

span.no_selection {
    user-select: none; /* standard syntax */
    -webkit-user-select: none; /* webkit (safari, chrome) browsers */
    -moz-user-select: none; /* mozilla browsers */
    -khtml-user-select: none; /* webkit (konqueror) browsers */
    -ms-user-select: none; /* IE10+ */
}

En javascript simple:

element.addEventListener('mousedown', function(e){ e.preventDefault(); }, false);

O con jQuery:

jQuery(element).mousedown(function(e){ e.preventDefault(); });

Para evitar la selección de texto SOLO después de hacer doble clic:

Podrías usar la MouseEvent#detailpropiedad. Para eventos de mousedown o mouseup, es 1 más el recuento de clics actual.

document.addEventListener('mousedown', function (event) {
  if (event.detail > 1) {
    event.preventDefault();
    // of course, you still do not know what you prevent here...
    // You could also check event.ctrlKey/event.shiftKey/event.altKey
    // to not prevent something useful.
  }
}, false);

Ver https://developer.mozilla.org/en-US/docs/Web/API/UIEvent/detail

FWIW, configuré user-select: noneel elemento primario de esos elementos secundarios que no quiero seleccionar de alguna manera cuando hago doble clic en cualquier parte del elemento primario. ¡Y funciona! ¡Lo bueno es que la contenteditable="true"selección de texto, etc. todavía funciona en los elementos secundarios!

Asi como:

<div style="user-select: none">
  <p>haha</p>
  <p>haha</p>
  <p>haha</p>
  <p>haha</p>
</div>

Una función Javascript simple que hace que el contenido dentro de un elemento de página no sea seleccionable:

function makeUnselectable(elem) {
  if (typeof(elem) == 'string')
    elem = document.getElementById(elem);
  if (elem) {
    elem.onselectstart = function() { return false; };
    elem.style.MozUserSelect = "none";
    elem.style.KhtmlUserSelect = "none";
    elem.unselectable = "on";
  }
}

Para aquellos que buscan una solución para Angular 2+ .

Puede usar la mousedownsalida de la celda de la tabla.

<td *ngFor="..."
    (mousedown)="onMouseDown($event)"
    (dblclick) ="onDblClick($event)">
  ...
</td>

Y prevenir si el detail > 1.

public onMouseDown(mouseEvent: MouseEvent) {
  // prevent text selection for dbl clicks.
  if (mouseEvent.detail > 1) mouseEvent.preventDefault();
}

public onDblClick(mouseEvent: MouseEvent) {
 // todo: do what you really want to do ...
}

La dblclicksalida continúa funcionando como se esperaba.

o, en mozilla:

document.body.onselectstart = function() { return false; } // Or any html object

En IE,

document.body.onmousedown = function() { return false; } // valid for any html object as well

Hilo antiguo, pero se me ocurrió una solución que creo que es más limpia, ya que no deshabilita cada enlace vinculado al objeto, y solo evita selecciones de texto al azar y no deseadas en la página. Es sencillo y funciona bien para mí. Aquí hay un ejemplo; Quiero evitar la selección de texto cuando hago clic varias veces en el objeto con la clase "flecha derecha":

$(".arrow-right").hover(function(){$('body').css({userSelect: "none"});}, function(){$('body').css({userSelect: "auto"});});

HTH!

Si está tratando de evitar por completo la selección de texto por cualquier método, así como solo con un doble clic, puede usar el user-select: noneatributo css. He probado en Chrome 68, pero de acuerdo con https://caniuse.com/#search=user-select , debería funcionar en los otros navegadores de usuario normales actuales.

Comportalmente, en Chrome 68 es heredado por elementos secundarios, y no permitía seleccionar el texto contenido de un elemento incluso cuando se seleccionó el texto que rodea e incluye el elemento.

Para evitar IE 8 CTRL y SHIFT, haga clic en la selección de texto en un elemento individual

var obj = document.createElement("DIV");
obj.onselectstart = function(){
  return false;
}

Para evitar la selección de texto en el documento

window.onload = function(){
  document.onselectstart = function(){
    return false;
  }
}

Yo tuve el mismo problema. Lo resolví cambiando <a>y agregando onclick="return false;"(para que al hacer clic en él no se agregue una nueva entrada al historial del navegador).