torinaブログ

DjangoとBootstrap4で作成したブログ
Python, Django, Kivy, Bootstrap, Apache等のメモです
ソースコード

ブラウザから、ボタンを押すとクリップボードにコピー

HTMLとCSSとJavaScript ウェブブラウザ
約478日前 2015年11月6日21:14
あるページで、ボタンポチってするとコピーさせたいなんてときのメモ

<!DOCTYPE html>
<html lang=`ja`>
  <head>
    <meta charset=`utf-8`>
    <title>クリップボードにコピー</title>
  </head>
  <body>
    <button id=`btn`>クリップボードにコピー</button>
    <textarea id=`text`></textarea>
    
    <script src=`http://cdnjs.cloudflare.com/ajax/libs/zeroclipboard/2.2.0/ZeroClipboard.min.js`></script>
    <script type=`text/JavaScript`>
      var btn = document.getElementById(`btn`);
      var clip = new ZeroClipboard(btn);
      
      clip.on(`ready beforecopy`, function() {
          var text = document.getElementById(`text`).value;
          btn.dataset.clipboardText = text;
      });
    
    </script>
  </body>

</html>

デモ
https://torina.top/media/images/9bcd12dd-f93f-41f1-8d12-d530f1fd44d7.html

ボタンを押すと、それだけでテキストエリアの内容がコピーされるのがわかるだろうか。
Flashを使用しているとかで、Flashが使えない環境では動かない
正直よくわからん