テレットブログ

JavaScriptを使用してテキストをクリップボードにコピーする方法

2020年05月10日
image
通常、キーボードのキーの組み合わせ(CTRL + C)を使用して、テキストをクリップボードにコピーします。ボタンクリックでクリップボードにコピー
HTML DOMのexecCommand()メソッドの、テキストをクリップボードにコピーする簡単な方法。
JavaScriptが最も簡単に利用可能です。
 

execCommand()は、ドキュメントの選択されたセクションに対して特定のコマンドを実行します。
この
copyコマンドをdocument.execCommand()で使用して、JavaScriptを使用してテキストコンテンツをクリップボードにコピーできます。
サンプルコードスニペットでは、JavaScriptを使用してテキストをクリップボードにコピーする方法を示します。

次のコードは、execCommandおよびJavaScriptを使用して、ボタンのクリック時に入力テキストフィールドからクリップボードにテキストをコピーします。

HTML

< input  type = "text"  value = "Welcome to CodexWorld"  id = "textInput" > 
< button  onclick = "copyText()" > Copy text 


Javascript
 
<script>
function copyText(){
    var text = document.getElementById("textInput");
    text.select();
    document.execCommand("copy");
    alert("Copied the text: " + text.value);
}
</script>



新着記事

image

conoha vps で postfix にDKIMをセットする

2025年06月02日
# メールサーバー設定作業レポート ## 1. 作業概要 ConoHa
Read more →
image

shopipyのページネーションについて

2023年11月15日
Shopify APIのレスポンスヘッダーには、ページネーションに関す
Read more →
image

Git-ftpを使ったファイルアップロードの方法

2023年04月20日
タイトル: Git-ftpを使ったファイルアップロードの方法 概要
Read more →
image

ChatGPTとjQueryの組み合わせで新しい時代のウェブ開発をリード

2023年04月19日
近年、AI技術がウェブ開発の分野においても急速に浸透しています。特に、ChatG
Read more →
image

ChatGPTで日本語をマスター!次世代AI技術を活用したコミュニケーションの強化

2023年04月18日
ChatGPTは、OpenAIが開発した最先端のAI技術であり、自然言語処理(N
Read more →
Choose Colour