こんにちは。たなかです。
ブラウザに表示されている、自動採番されたIDをクリップボードにコピーさせたい、というシチュエーションに遭遇しました。
WebアプリであればJavaScriptで簡単に実装できるとのことで、やり方を備忘録的に書いておこうと思います。
JavaScriptでクリップボードにテキストをコピー
百聞は一見に如かずということでサクッとコード載せちゃいます。どーーん。
// 引き継ぎIDのコピー
function copyToClipboard() {
// コピー対象をJavaScript上で変数として定義する
var copyTarget = document.getElementById("copyTarget");
// コピー対象のテキストを選択する
copyTarget.select();
// 選択しているテキストをクリップボードにコピーする
document.execCommand("copy");
}
キーボードでいうと
copyTarget.select(); でテキストを選択した状態になり、
document.execCommand("Copy"); でctrl + cを押したみたいな動きになります。
ライブラリとか使わず素JSで簡単に書けるんですね。
ちなみに execCommand("paste"); でテキストのペーストもできるらしいですが、セキュリティの問題で動作しないブラウザが多いみたいです。
また今回は「WebViewでモバイル端末のクリップボードにテキストをコピーさせたい」という目論見だったのですが、そのような場合にはJSではなくネイティブ側での対応が必要になるとのことでした。
iOSのWeb(Safar、Chrome、WebView)では execCommand("copy"); が動かないとのことです。
短いですが今回はここまで。
