「毎日Unity」の技術ブログ

開発で役立つ情報を発信する

【JavaScript】クリップボードに張り付ける方法

JavaScript

クリップボードに張り付ける方法を自分用にメモ。

[ 方法 ]

「document.execCommand("copy");」を使えばクリップボードに張り付けることができます。

var CopyText = document.getElementById("Text");

//文字をすべて選択します。
CopyText.select();

//クリップボードに張り付けます。
document.execCommand("copy");

[ 注意点 ]

「document.execCommand("copy");」は、実行時に選択されている文字をクリックボードに張り付けます。したがって、文字を選択する「CopyText.select();」を消してしまうと、張り付けることができません。

[ 使用例 ]

下記はCopyボタンを押すとテキストエリアの文字をクリップボードに張り付けます。

<!doctype html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
  </head>
  <body>

    <input type="text" id="Text">

    <br>

    <input type="button" value="Copy" onClick="Copy()" style="width:100px; height:30px; -webkit-appearance:none;">

    <script>

      function Copy()
      {
        var CopyText = document.getElementById("Text");
        CopyText.select();
        document.execCommand("copy");
      }
      
    </script>

  </body>
</html>