eventos - ¿Cuál es la mejor manera de evitar el resaltado de texto al hacer clic en su div que contiene en javascript?
onclick html ejemplo (4)
Espero que esto es lo que estás buscando.
<script type="text/javascript">
function clearSelection() {
var sel ;
if(document.selection && document.selection.empty){
document.selection.empty() ;
} else if(window.getSelection) {
sel=window.getSelection();
if(sel && sel.removeAllRanges)
sel.removeAllRanges() ;
}
}
</script>
<div ondblclick="clearSelection()">Some text goes here.</div>
Estoy construyendo un menú en HTML / CSS / JS y necesito una manera de evitar que el texto en el menú se resalte al hacer doble clic en él. Necesito una manera de pasar los identificadores de varios divs en una función y tener resaltado desactivado dentro de ellos.
Entonces, cuando el usuario hace doble clic (en el propósito) en el menú, el menú muestra sus subelementos pero su texto no se resalta.
Hay varios scripts por ahí flotando en la web, pero muchos parecen desactualizados. ¿Cuál es la mejor manera?
Puede usar este CSS para simplemente ocultar el color de selección (no admitido por IE):
#id::-moz-selection {
background: transparent;
}
#id::selection {
background: transparent;
}
Tú podrías:
- Déle ("es" su texto) un evento onclick
- Primer clic establece una variable a la hora actual
- En segundo lugar, haga clic en las comprobaciones para ver si esa variable es x hora a partir de la hora actual y actual (por lo que un doble clic sobre, por ejemplo, 500 ms, no se registra como un doble clic)
- Si es un doble clic, haga algo en la página como agregar HTML oculto, haciendo document.focus (). Tendrás que experimentar con estos ya que algunos pueden causar desplazamiento no deseado.
En (Mozilla, Firefox, Camino, Safari, Google Chrome) puedes usar esto:
div.noSelect {
-moz-user-select: none; /* mozilla browsers */
-khtml-user-select: none; /* webkit browsers */
}
Para IE no hay una opción CSS, pero puede capturar el evento ondragstart y devolver falso;
Actualizar
El soporte del navegador para esta propiedad se ha expandido desde 2008.
div.noSelect {
-webkit-user-select: none; /* Chrome all / Safari all */
-moz-user-select: none; /* Firefox all */
-ms-user-select: none; /* IE 10+ */
}