unoh.github.com

JavaScriptでクリップボードを使う(IE/Firefox)

2006-12-21 09:55:02 +0000

こんにちは、さかとくです。師走で忙しいですね。今回は、JavaScriptでクリップボードを使うプログラムを作ってみます。IEとFirefoxで動く簡単なライブラリを作ってみましたので、参考にしてください。

IEだけで動かすのは、簡単なのですが、FireFoxではクリップボードを操作する方法がありません。そこで、FireFoxでも使えるようにFlashを使って工夫してみます。

まず、参考までにIEでクリップボードを扱うJavaScriptを見てみましょう。IEなら以下のように一行書くだけです。
// クリップボードに Helloと書き込む(IEのみ)
clipboardData.setData("Text", "Hello");

FireFoxでコピーするためには、Flashを使います。Flashでは以下のように書くと、"Hello"という文字列をクリップボードに書き込みます。Flashなら、IEだろうが、FireFoxだろうが動きますので、これを利用します。
// クリップボードに Helloと書き込む(Flash)
System.setClipboard( "Hello" );

Flash Player8以降では、JavaScriptからFlashを自由に操作するExternal APIというものがあります。これを利用すれば、JavaScriptから、クリップボードを操作することができます。

MTASCというフリーのFlashコンパイラを使うと以下のように書けます。
import flash.external.ExternalInterface;
class clipbrd {
 static function main () { var clip = new clipbrd(); }
 function clipbrd() {
  ExternalInterface.addCallback("copyText", this, copyText);
 }
 function copyText(s:String) {
  System.setClipboard(s);
 }
}
これで、バッチリですね! コンパイルした完成品を以下においておきます。
ファイルをダウンロード
このライブラリの使い方を以下に書いておきますので、使ってみてください。

■[使い方]

(1) 以下のファイルをHTMLと同じフォルダか参照できるところにコピー
-clipbrd.swf
-clipbrd.js
-swfobject.js

(2) 以下のコードをHTMLに貼り付ける
--- ここから ---
<script type="text/javascript" src="swfobject.js"></script>
<script type="text/javascript" src="clipbrd.js"></script>
--- ここまで ---

(3) クリックしたらコピーするようにする場合には以下のように記述

--- ここから ---
clipbrd.copyText("hogehoge");
--- ここまで ---