jQuery - zaznacz cały tekst z obszaru tekstowego

Jak mogę to zrobić, aby po kliknięciu w obszarze tekstowym cała jego zawartość została zaznaczona?

I w końcu, gdy klikniesz ponownie, aby odznaczyć.

Aby użytkownik nie denerwował się, gdy cały tekst jest zaznaczany za każdym razem, gdy próbuje przesunąć kursor za pomocą myszy, należy to zrobić za pomocą focuszdarzenia, a nie clickzdarzenia. Następujące będzie wykonać zadanie i radzi sobie z problemem w Chrome, który zapobiega najprostsza wersja (czyli po prostu wywołanie textarea za select()metodę w focusobsługi zdarzeń) z pracy.

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

Kod:

<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>

Wersja 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;
    });
});

Lepszy sposób, z rozwiązaniem problemu zakładek i chrome oraz nowym sposobem 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;
            });
        }
    });

Skończyło się na tym:

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

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

Nieco krótsza wersja jQuery:

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

Prawidłowo obsługuje narożną obudowę Chrome. Zobacz przykład http://jsfiddle.net/Ztyx/XMkwm/ .

Zaznaczanie tekstu w elemencie (podobne do podświetlania myszą)

:)

Korzystając z zaakceptowanej odpowiedzi w tym poście, możesz wywołać funkcję w następujący sposób:

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