jQuery: selecciona todo el texto de un área de texto

¿Cómo puedo hacer que cuando haga clic dentro de un área de texto, se seleccione todo su contenido?

Y, finalmente, cuando haga clic nuevamente, para anular la selección.

Para evitar que el usuario se enfade cuando se selecciona todo el texto cada vez que intenta mover el cursor con el mouse, debe hacerlo usando el focusevento, no el clickevento. A continuación se hará el trabajo y las obras en torno a un problema en Chrome que previene la versión más simple (es decir, sólo llamar del área de texto select()método en un focuscontrolador de eventos) de trabajar.

jsFiddle: http://jsfiddle.net/NM62A/

Código:

<textarea id="foo">Some text</textarea>

<script type="text/javascript">
    var textBox = document.getElementById("foo");
    textBox.onfocus = function() {
        textBox.select();

        // Work around Chrome's little problem
        textBox.onmouseup = function() {
            // Prevent further mouseup intervention
            textBox.onmouseup = null;
            return false;
        };
    };
</script>

Versión de jQuery:

$("#foo").focus(function() {
    var $this = $(this);
    $this.select();

    // Work around Chrome's little problem
    $this.mouseup(function() {
        // Prevent further mouseup intervention
        $this.unbind("mouseup");
        return false;
    });
});

Mejor manera, con solución al problema de tab y Chrome y nueva forma jquery

$("#element").on("focus keyup", function(e){

        var keycode = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;
        if(keycode === 9 || !keycode){
            // Hacemos select
            var $this = $(this);
            $this.select();

            // Para Chrome's que da problema
            $this.on("mouseup", function() {
                // Unbindeamos el mouseup
                $this.off("mouseup");
                return false;
            });
        }
    });

Terminé usando esto:

$('.selectAll').toggle(function() {
  $(this).select();
}, function() {
  $(this).unselect();
});

$('textarea').focus(function() {
    this.select();
}).mouseup(function() {
    return false;
});

Versión jQuery ligeramente más corta:

$('your-element').focus(function(e) {
  e.target.select();
  jQuery(e.target).one('mouseup', function(e) {
    e.preventDefault();
  });
});

Maneja la caja de la esquina de Chrome correctamente. Consulte http://jsfiddle.net/Ztyx/XMkwm/ para ver un ejemplo.

Seleccionar texto en un elemento (similar a resaltar con el mouse)

:)

Usando la respuesta aceptada en esa publicación, puede llamar a la función de esta manera:

$(function() {
  $('#textareaId').click(function() {
    SelectText('#textareaId');
  });
});