Unos cuantos han sido los artículos que le hemos dedicado a la selección de texto con jQuery: Seleccionar el texto de un campo, Seleccionar el texto al posicionarse en un campo y Detectar el texto seleccionado con jQuery. Pero no quería dejar de escribir uno que nos va a dar un buen efecto visual y este consiste en seleccionar un texto solo si este no ha cambiado con jQuery.

Es decir, seleccionaremos el texto del campo si sigue siendo el mismo que al cargar la página. Si el usuario ha cambiado el contenido, ya no lo seleccionaremos.

Manos a la obra… Lo primero el formulario al uso (casi que ya lo imaginas).

  Inserta texto:
  

  Cada vez que pinches en el área de texto se selecionará. Esto sucederá mientras no cambies el contenido original del mismo.

  Texto por defecto

Hay que fijarse bien que hemos puesto los campos input y textarea con textos por defecto.

Será cuándo el usuario acceda al campo cuando comprobaremos si ha cambiado el texto. Para ello utilizamos el método .focus() de jQuery. En este caso vamos a ver cómo sería para el textarea.

$(document).ready(function(){	
	$("textarea").focus(function(){...});
});

Ahora tenemos que diferenciar como conseguir el texto que tiene actualmente y el texto que estaba por defecto. El texto actual lo conseguiremos con .value y el texto por defecto con .defaultValue.

Así que seleccionaremos el texto, es decir, lamaremos al método .select() si son iguales.

$(document).ready(function(){	
  $("textarea").focus(function(){	    
    if(this.value == this.defaultValue){
      this.select();
    }
  });
});

Así ya hemos seleccionado el texto solo si este no ha cambiado.