window.getSelection () para contenteditable div * en clic *

Tengo una div contenteditable y quiero obtener la selección del usuario cuando hacen clic en un span .

Mi problema es que cuando hago clic en el span , la selección se deselecciona para que window.getSelection().toString() devuelva '' .

¿Cómo puedo hacer que esto funcione al hacer clic en un span de span ?

Sé que funciona la getSelection() real, porque si window.getSelection().toString() en un setTimeout de 5 segundos, después de 5 segundos, ¡obtengo el texto seleccionado!

Mi código:

 $('#btn').click(function() { console.log(window.getSelection().toString()); //returns '' }); 
 #btn { cursor: pointer; } 
  get selection 

test

Como no hay ningún evento que pueda usar para detectar específicamente un ‘seleccionar’ o ‘anular la selección’, tendrá que escuchar un evento de mouseup y completar una “variable de caché” que pueda almacenar la selección en la memoria:

 var selection = ''; document.getElementById('ce').onmouseup = function(){ selection = window.getSelection().toString(); }; document.getElementById('btn').onclick = function(){ console.log(selection); }; 

O bien, siempre que tenga jQuery, podría probar esta versión más de reclamos, que también tiene en cuenta las selecciones basadas en el teclado:

 var selection = '', shifted = false; $('#ce').on('mouseup keyup keydown', function(e){ if (e.type === 'keydown') { shifted = e.shiftKey; return; } if ( e.type === 'mouseup' || (shifted && (e.keyCode === 39 || 37 || 38 || 40)) ){ selection = window.getSelection().toString(); } }); $('#btn').on('click', function(){ console.log(selection); }); 

Puede almacenar la selección cuando hay un clic en su div satisfactorio y luego devolverlo cuando hace clic en el botón.

 document.querySelector("#ce").addEventListener(function(){ userSelection= window.getSelection().toString(); }); document.querySelector("#btn").addEventListener("mouseup",function(){ document.querySelector("#selection").innerHTML= "You have selected:
" + userSelection +""; });

http://jsfiddle.net/xnvp38u3/