ワンクリックで DIV 内のすべてのテキストを選択する方法

マウスを 1 回クリックするだけで DIV テキストを簡単に選択できます

素早く便利なテキスト操作を行うには、コンテンツ全体を強調表示して選択することが望ましいことがよくあります。 DIVタグの。これにより、ユーザーは選択したテキストのドラッグや右クリックによるコピーなどの操作を簡単に実行できるようになります。

これを実現する方法:

これを実現するには、次のことができます。ブラウザの選択機能を利用する JavaScript 関数を活用します。仕組みは次のとおりです:

コード スニペット:

function selectText(containerid) {
    if (document.selection) { // IE
        var range = document.body.createTextRange();
        range.moveToElementText(document.getElementById(containerid));
        range.select();
    } else if (window.getSelection) {
        var range = document.createRange();
        range.selectNode(document.getElementById(containerid));
        window.getSelection().removeAllRanges();
        window.getSelection().addRange(range);
    }
}

実装:

HTML に次の内容を含めます。 ID を持つ DIV 要素内のテキストを選択するコード"selectable":

<div>

ユーザーがこの DIV 内の任意の場所をクリックすると、上記の JavaScript 関数が実行され、その内容がすべて強調表示されます。これにより、手動で選択する必要がなく、テキストを非常に簡単に操作できるようになります。

以上がワンクリックで DIV 内のすべてのテキストを選択する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。