シングルクリックで DIV 要素内のすべてのテキストを選択するにはどうすればよいですか?

シングルクリックで DIV 内のすべてのテキストを選択

ユーザーが DIV 要素内のすべてのテキストを簡単に選択できるようにすると、生産性とユーザーが向上します。経験。これは、マウスのクリックに応じて特定のアクションを実行できるイベント ハンドラーを使用することで実現できます。

次の例を考えてみましょう。ここでは、ID が「selectable」の DIV に URL が含まれているとします。

<div>

ユーザーが DIV をクリックしたときに URL テキストを自動的に選択するには、次の 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 コードをページに追加します。

<div>

このコードにより、ユーザーが ID を持つ DIV をクリックしたときに、 「選択可能」の場合、URL テキスト全体が選択され、テキストのドラッグ、コピー、貼り付けが簡単に行えます。

以上がシングルクリックで DIV 要素内のすべてのテキストを選択するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。