Cuando ponemos campos de entrada en nuestras páginas web, el usuario podrá seleccionar parte del texto que haya en dichos campos. Vamos a ver como detectar el texto seleccionado utilizando jQuery.
Lo primero será poner un textarea con un texto de ejemplo:
Para utilizar jQuery tendremos que cargar la librería de jQuery:
El método de jQuery que nos ayudará a detectar el texto seleccionado es .select(). Este método habrá que asignarlo al elemento de la página sobre el que queremos detectar el texto seleccionado. En nuestro código el textarea ‘texto’.
$("#texto").select(function(){ ... });
El contenido que ha sido seleccionado se puede recuperar mediante el método .getSelection() de Javascript. Así que solo tendremos que ejecutar este método y volcarlo sobre la pantalla.
$("#texto").select(function(){
selectedText = document.getSelection();
$("#resultado").html("Se ha seleccionado el texto " + selectedText);
});
Para volcarlo en pantalla utilizamos el método .html() sobre una capa.