javascript - qué - que es clic derecho

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

Question

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

Answer 1

En javascript plano:

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

O con jQuery:

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

Answer 2

Hilo antiguo, pero se me ocurrió una solución que creo que es más limpia, ya que no deshabilita todos los enlaces vinculados al objeto, y solo evita selecciones de texto aleatorias 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!

Answer 3

Para evitar IE 8 CTRL y MAYÚS, 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;
  }
}

Answer 4

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

Podrías usar la propiedad de MouseEvent#detail . Para eventos de ratón 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);

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

Answer 5

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

De manera conductual, en Chrome 68 se hereda con elementos secundarios y no permitía seleccionar el texto contenido de un elemento, incluso cuando se seleccionaba el texto que rodeaba e incluía el elemento.

Answer 6

Una simple función de Javascript 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";
  }
}

Answer 7

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

Answer 8

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

Answer 9

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 {
    -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+ */
}