web-dev-qa-db-ja.com

ボタンがクリックされたときにクリップボードのテキストエリアのテキストをコピーする

button内のすべてを選択し、ボタンをクリックしたときにテキストをtextareaにコピーするjQuery(またはjavascript)clipboardを作成しようとしています。

Focusイベントを使用したいくつかの例を見つけました。しかし、選択とコピーのために実際にクリックする必要があるボタンを探しています。

これをどのように行うことができますか?

22
GRU119

textareaのテキストを選択するには select() を使用し、選択したテキストをコピーするには execCommand('copy') を使用する必要があります。ブラウザの上位バージョンでの動作。

$("button").click(function(){
    $("textarea").select();
    document.execCommand('copy');
});

また、下に示すようにjqueryなしでこの作業を行うことができます

document.querySelector("button").onclick = function(){
  document.querySelector("textarea").select();
  document.execCommand('copy');
};
<button>Select</button>
<br/>
<textarea></textarea>
47
Mohammad

JQueryを使用せずにこれを作成することは可能です。

これが純粋なjsソリューションです。

function copy() {
  let textarea = document.getElementById("textarea");
  textarea.select();
  document.execCommand("copy");
}
<textarea id="textarea"></textarea>
<br>
<button onclick="copy()">Copy</button>
8
karoluS