En el Evento de Resaltado de Texto?

Tengo curiosidad si alguien sabe cómo activaría una función para que se ejecute si/una vez que el usuario termina de seleccionar texto en la página web? Me gustaría que el usuario sea capaz de seleccionar el texto, y después de un corto retraso(o inmediatamente, en este punto no importa mucho) aparece un botón de superposición cerca del texto que el usuario puede hacer clic y vuelvo y ejecutar más de mi código que se basa en la selección. Esto es para una extensión de Firefox.

Un ejemplo similar que se me ocurre sería como en Es decir, donde se puede seleccionar el texto y luego aparece el "aceleradores web". Estoy 99% seguro de que sé cómo realmente superponer el botón, y obtener la posición del texto seleccionado, pero no tengo idea de cómo comprobar para ver si hay algo seleccionado, sin hacer algún tipo de bucle infinito, que parece una idea terrible.

Gracias de antemano!

EDITAR: 

//In my overlay.js with the rest of my sidebar code
isTextSelected: function () {   
        var myText = cqsearch.getSelectedText();
        var sidebar = document.getElementById("sidebar");
        var sidebarDoc = sidebar.contentDocument || document;

        var curHighlightedDiv = sidebarDoc.getElementById("testDiv");
        curHighlightedDiv.innerHTML = "Current text selection:" + myText;
    }
};

//In my on firefox load function I added this
document.onmouseup = cqsearch.isTextSelected;

Así que esto es lo que se me ha ocurrido usando la sugerencia de Robert, y me llevó algún tiempo conseguir todo en el lugar correcto, pero funciona muy bien! Ahora a colocar mi botón. Muchas gracias!

Author: Robert Smith, 2010-09-17
Source

4 answers

No hay ningún onhighlightext ni nada parecido, pero una solución sería enlazar onmouseup para verificar si se selecciona algún texto si no está en un input/textarea.

Editar

Aquí hay un ejemplo de implementación para usted. Solo probé esto en Chrome / Firefox / IE7. Esto funciona en las entradas.

Http://jsfiddle.net/qY7gE /

Código de JSFiddle:

var t = '';
function gText(e) {
    t = (document.all) ? document.selection.createRange().text : document.getSelection();

    document.getElementById('input').value = t;
}

document.onmouseup = gText;
if (!document.all) document.captureEvents(Event.MOUSEUP);
<input type='text' id='input' />
In software, a stack overflow occurs when too much memory is used on the call stack. The call stack contains a limited amount of memory, often determined at the start of the program. The size of the call stack depends on many factors, including the programming language, machine architecture, multi-threading, and amount of available memory. When too much memory is used on the call stack the stack is said to overflow, typically resulting in a program crash.[1] This class of software bug is usually caused by one of two types of programming errors.[2]
 63
Author: Robert,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-02-10 10:06:02

Un poco tarde para la fiesta, pero para referencia futura...

Echa un vistazo al evento DOM selecten MDN.

Se dispara una vez que se libera el ratón o la tecla (al menos en Chrome 40).

document.addEventListener('select', callback);

 4
Author: jarsbe,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-02-10 06:13:54

La solución que usa el truco mouseup no es la solución adecuada. Esa es una forma de hacky y no es perfecta. Menos eficiente también, ya que ahora estás atrapando mouseups para tanta mierda.

La forma real de hacerlo en Firefox addon es usar addSelectionListener ver este tema: Observar para resaltar?

Ahora, incluso si el usuario usa el teclado para hacer selecciones, se captura.

Crédito a Neil por informarme sobre dónde encontrarlo en MXR

 0
Author: Noitidart,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-05-23 12:26:23

Hay un evento nativo para cuando se realiza / cambia una selección de texto. selectionchange tiene soporte básico en la mayoría de los navegadores, incluido IE, y funcionará para cualquier texto dentro de un documento, no solo para elementos de formulario. 

document.addEventListener("selectionchange",event=>{
  let selection = document.getSelection ? document.getSelection().toString() :  document.selection.createRange().toString() ;
  console.log(selection);
})
select this text

Tenga en cuenta que, como su nombre lo indica, dispara cualquier cambio de una selección. Por lo tanto, recibirá varias llamadas a su función de devolución de llamada a medida que selecciona texto.

 0
Author: Patrick Evans,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-09-04 02:21:58