tande lab.

[JavaScript] テキストをクリップボードにコピーする

テキストをクリップボードにコピーするときのメモ。

Chrome Extension “Color Thief – 色泥棒” を作ってる時に悩んだのですが、
任意のテキストをクリップボードへコピーするなら、

document.execCommand("copy");

これ書けばできるだろーと思ってたら、なんでだかできない。

色々調べたら、任意のテキストなんでもできるわけではなくて、
テキストフォーム上にあるテキストにしか機能しないようです。

なので、非常にまどろっこしいのですが、
テキストエリアをフェイクで作ってそこにテキストを格納してコピー
その後、フェイクのテキストエリアを消す。
ということをやる必要がありました。

javascript – Copy to Clipboard in Chrome Extension – Stack Overflow

を参考にしました。

以下、サンプルコード。

// テキストをクリップボードにコピーする関数
var copyTextToClipboard = function(txt){
	var copyArea = $("<textarea/>");
	copyArea.text(txt);
	$("body").append(copyArea);
	copyArea.select();
	document.execCommand("copy");
	copyArea.remove();
}

使うときは、

var cTxt = "hogehoge";
copyTextToClipboard(cTxt);

// クリップボードの中身
// hogehoge

てな感じで、引数にクリップボードに格納したい文字を入れれば OK です。