1. ホーム
  2. javascript

[解決済み] jQuery - テキストエリアからすべてのテキストを選択する

2022-06-29 11:25:34

質問

テキストエリア内をクリックすると、その内容全体が選択されるようにするにはどうしたらよいでしょうか。

そして最終的にもう一度クリックすると、選択解除されるように。

どのように解決するのですか?

マウスでキャレットを動かそうとするたびにテキスト全体が選択され、ユーザがイライラするのを防ぐには、このように focus イベントではなく click イベントではなく、 イベントを使用します。以下のようにすると、Chromeの問題を回避することができ、最も単純なバージョン(つまり、単にテキストエリアの select() メソッドを focus イベントハンドラ) が動作するようになりました。

jsFiddleです。 http://jsfiddle.net/NM62A/

コードです。

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

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