回答:
現在、ほとんどの最新のブラウザでこれを簡単に行う方法があります
document.execCommand('copy');現在選択されているテキストをコピーします。次を使用して、textAreaまたは入力フィールドを選択できます。
document.getElementById('myText').select();テキストを非表示にコピーするには、textAreaをすばやく生成し、ボックス内のテキストを変更して選択し、コピーしてから、textAreaを削除します。ほとんどの場合、このtextAreaは画面に点滅しません。
セキュリティ上の理由から、ブラウザでは、ユーザーが何らかのアクション（ボタンのクリックなど）を実行した場合にのみコピーが許可されます。これを行う1つの方法は、テキストをコピーするメソッドを呼び出すHTMLボタンにonClickイベントを追加することです。
完全な例：
function copier(){
document.getElementById('myText').select();
document.execCommand('copy');
}<button onclick="copier()">Copy</button>
<textarea id="myText">Copy me PLEASE!!!</textarea>セキュリティ上の理由から、Firefoxではテキストをクリップボードに配置できません。ただし、Flashを使用した回避策があります。
function copyIntoClipboard(text) {
var flashId = 'flashId-HKxmj5';
/* Replace this with your clipboard.swf location */
var clipboardSWF = 'http://appengine.bravo9.com/copy-into-clipboard/clipboard.swf';
if(!document.getElementById(flashId)) {
var div = document.createElement('div');
div.id = flashId;
document.body.appendChild(div);
}
document.getElementById(flashId).innerHTML = '';
var content = '<embed src="' +
clipboardSWF +
'" FlashVars="clipboard=' + encodeURIComponent(text) +
'" width="0" height="0" type="application/x-shockwave-flash"></embed>';
document.getElementById(flashId).innerHTML = content;
}唯一の欠点は、これにはフラッシュを有効にする必要があることです。
ソースは現在死んでいます：http : //bravo9.com/journal/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2-cc6c-4ebf-9724-d23e8bc5ad8a/（そしてそれはGoogleのキャッシュです）
オンラインスプレッドシートはCtrl + C、Ctrl + Vイベントをフックし、非表示のTextAreaコントロールにフォーカスを転送し、コピーするためにそのコンテンツを目的の新しいクリップボードコンテンツに設定するか、イベントが貼り付けのために終了した後にコンテンツを読み取ります。
参照JavaScriptを使用してFirefox、Safari、Chromeでクリップボードを読み取ることはできますか？
それは2015年の夏であり、Flashを取り巻く混乱により、この質問に新しい回答を追加して、Flashの使用を完全に回避したいと思いました。
clipboard.jsは、テキストまたはHTMLデータをクリップボードにコピーできる便利なユーティリティです。非常に使いやすく、.jsをインクルードして、次のようなものを使用するだけです。
<button id='markup-copy'>Copy Button</button>
<script>
document.getElementById('markup-copy').addEventListener('click', function() {
clipboard.copy({
'text/plain': 'Markup text. Paste me into a rich text editor.',
'text/html': '<i>here</i> is some <b>rich text</b>'
}).then(
function(){console.log('success'); },
function(err){console.log('failure', err);
});
});
</script>clipboard.jsもGitHubにあります
2017年にこれを行うことができます（このスレッドはほぼ9年前なので、こう言ってください！）
function copyStringToClipboard (string) {
function handler (event){
event.clipboardData.setData('text/plain', string);
event.preventDefault();
document.removeEventListener('copy', handler, true);
}
document.addEventListener('copy', handler, true);
document.execCommand('copy');
}そして今、コピーする copyStringToClipboard('Hello World')
このsetData行に気づき、さまざまなデータ型を設定できるかどうか疑問に思った場合、答えは「はい」です。
.select()これを呼び出す前に入力ボックスでa を実行する必要がありました。
Firefoxではデータをクリップボードに保存できますが、セキュリティ上の理由により、デフォルトでは無効になっています。これを有効にする方法については、Mozilla Firefoxナレッジベースの「クリップボードへのJavaScriptアクセスの許可」を参照してください。
amdfanが提供するソリューションは、多数のユーザーがいて、ブラウザーの構成が選択肢ではない場合に最適です。クリップボードが使用可能かどうかをテストし、設定を変更するためのリンクを提供できますが、ユーザーが技術に精通している場合は、JavaScriptエディターTinyMCEはこのアプローチに従います。
copyIntoClipboard（）関数はFlash 9で機能しますが、Flashプレーヤー10のリリースにより機能しないようです。新しいFlashプレーヤーで機能する解決策を次に示します。
http://bowser.macminicolo.net/~jhuckaby/zeroclipboard/
これは複雑なソリューションですが、機能します。
これらのソリューションはどれも実際には機能しないと言わざるを得ません。受け入れられた回答からクリップボードソリューションを試してみましたが、Flash Player 10では機能しません。ZeroClipboardも試してみましたが、しばらくの間非常に満足していました。
現在、自分のサイト（http://www.blogtrog.com）で使用していますが、奇妙なバグに気づきました。ZeroClipboardが機能する方法は、ページ上の要素の上に非表示のFlashオブジェクトを配置することです。要素が移動した場合（ユーザーがウィンドウのサイズを変更したときなど）、ZeroClipboardフラッシュオブジェクトが壊れ、オブジェクトを覆っていないことがわかりました。おそらく元々あった場所にまだ座っていると思います。彼らはそれを止めるか、要素に貼り付けることになっているコードを持っていますが、それはうまく機能していないようです。
それで... BlogTrogの次のバージョンでは、私が実際に目にした他のすべてのコードハイライタに倣って、[クリップボードにコピー]ボタンを削除すると思います。:-(
（dp.syntaxhiglighterのCopy to Clipboardも壊れていることに気づきました。）
古い質問ですが、この回答はどこにも見当たりませんでした...
このリンクを確認してください：
http://kb.mozillazine.org/Granting_JavaScript_access_to_the_clipboard
みんなが言ったように、セキュリティ上の理由からデフォルトでは無効になっています。上記のリンクは、それを有効にする方法の説明を示しています（firefoxまたはuser.jsでabout：configを編集することにより）。
幸い、「AllowClipboardHelper」というプラグインがあり、数回クリックするだけで操作が簡単になります。ただし、Firefoxでアクセスを有効にする方法をウェブサイトの訪問者に指示する必要があります。
最新のdocument.execCommand（ "copy"）とjQueryを使用します。このstackoverflowの答えを見る
var ClipboardHelper = { // as Object
copyElement: function ($element)
{
this.copyText($element.text())
},
copyText:function(text) // Linebreaks with \n
{
var $tempInput = $("<textarea>");
$("body").append($tempInput);
$tempInput.val(text).select();
document.execCommand("copy");
$tempInput.remove();
}};呼び出す方法：
ClipboardHelper.copyText('Hello\nWorld');
ClipboardHelper.copyElement($('body h1').first());// JQUERY DOCUMENT
;(function ( $, window, document, undefined ) {
var ClipboardHelper = {
copyElement: function ($element)
{
this.copyText($element.text())
},
copyText:function(text) // Linebreaks with \n
{
var $tempInput = $("<textarea>");
$("body").append($tempInput);
//todo prepare Text: remove double whitespaces, trim
$tempInput.val(text).select();
document.execCommand("copy");
$tempInput.remove();
}
};
$(document).ready(function()
{
var $body=$('body');
$body.on('click', '*[data-copy-text-to-clipboard]', function(event)
{
var $btn=$(this);
var text=$btn.attr('data-copy-text-to-clipboard');
ClipboardHelper.copyText(text);
});
$body.on('click', '.js-copy-element-to-clipboard', function(event)
{
ClipboardHelper.copyElement($(this));
});
});
})( jQuery, window, document );<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<span data-copy-text-to-clipboard=
"Hello
World">
Copy Text
</span>
<br><br>
<span class="js-copy-element-to-clipboard">
Hello
World
Element
</span>フラッシュソリューションのわずかな改善は、swfobjectを使用してフラッシュ10を検出することです。
http://code.google.com/p/swfobject/
Flash 10と表示される場合は、JavaScriptを使用してShockwaveオブジェクトをロードしてみてください。Shockwaveは、lingoのcopyToClipboard（）コマンドを使用して、（すべてのバージョンの）クリップボードに対して読み取り/書き込みを行うことができます。
http://www.rodsdot.com/ee/cross_browser_clipboard_copy_with_pop_over_message.aspは、Flash 10およびすべてのFlash対応ブラウザーで動作します。
また、ZeroClipboardが更新され、Flashムービーが正しい場所に表示されなくなる原因となるページスクロールに関するバグを回避しています。
その方法は、ユーザーがボタンをクリックしてコピーすることを「要求する」ので、これはユーザーの便宜であり、悪意のあることは何も起きていません。
選択を格納するメモリグローバル変数を作成してみてください。そうすると、他の関数が変数にアクセスして、たとえば貼り付けを行うことができます。
var memory = '';//outside the functions but within the script tag.
function moz_stringCopy(DOMEle,firstPos,secondPos) {
var copiedString = DOMEle.value.slice(firstPos, secondPos);
memory = copiedString;
}
function moz_stringPaste(DOMEle, newpos) {
DOMEle.value = DOMEle.value.slice(0,newpos) + memory + DOMEle.value.slice(newpos);
}フラッシュをサポートしている場合は、https： //everyplay.com/assets/clipboard.swfを使用し、flashvarsテキストを使用してテキストを設定できます。
https://everyplay.com/assets/clipboard.swf?text=It%20Works
それは私がコピーに使用するものであり、使用できるこれらのオプションをサポートしていない場合は、追加として設定できます。
Internet Explorerの場合： window.clipboardData.setData（DataFormat、Text）およびwindow.clipboardData.getData（DataFormat）
DataFormatのTextおよびUrlを使用して、getDataおよびsetDataを実行できます。
データを削除するには：
DataFormatのファイル、HTML、画像、テキスト、URLを使用できます。PS：window.clipboardData.clearData（DataFormat）;を使用する必要があります。
また、window.clipboardDataおよびswf flashファイルをサポートしていないその他の場合は、キーボードのcontrol + cボタンを使用して、windowsおよびmacでそのコマンド+ cを使用することもできます。
アドオンコードから：
他の誰かがクロムコードからそれを行う方法を探していた場合は、ここで説明されているようにnsIClipboardHelperインターフェイスを使用できます：https ://developer.mozilla.org/en-US/docs/Using_the_Clipboard
を使用しdocument.execCommand('copy')ます。最新バージョンではサポートされているChrome、Firefox、Edge、とSafari。
function copyText(text){
function selectElementText(element) {
if (document.selection) {
var range = document.body.createTextRange();
range.moveToElementText(element);
range.select();
} else if (window.getSelection) {
var range = document.createRange();
range.selectNode(element);
window.getSelection().removeAllRanges();
window.getSelection().addRange(range);
}
}
var element = document.createElement('DIV');
element.textContent = text;
document.body.appendChild(element);
selectElementText(element);
document.execCommand('copy');
element.remove();
}
var txt = document.getElementById('txt');
var btn = document.getElementById('btn');
btn.addEventListener('click', function(){
copyText(txt.value);
})<input id="txt" value="Hello World!" />
<button id="btn">Copy To Clipboard</button>クリップボードAPIは、に取って代わるように設計されていdocument.execCommandます。Safariはまだサポートに取り組んでいるため、仕様が確定してSafariの実装が完了するまでフォールバックを提供する必要があります。
const permalink = document.querySelector('[rel="bookmark"]');
const output = document.querySelector('output');
permalink.onclick = evt => {
evt.preventDefault();
window.navigator.clipboard.writeText(
permalink.href
).then(() => {
output.textContent = 'Copied';
}, () => {
output.textContent = 'Not copied';
});
};<a href="/programming/127040/" rel="bookmark">Permalink</a>
<output></output>セキュリティ上の理由Permissionsから、クリップボードの読み書きにはクリップボードが必要な場合があります。スニペットがSOで機能しない場合はlocalhost、それを試してみてください。
Studio.201の@Davidからの優れた回答を基に、これはSafari、FF、およびChromeで機能します。また、textarea画面外に配置することにより、フラッシュが発生しないようにします。
// ================================================================================
// ClipboardClass
// ================================================================================
var ClipboardClass = (function() {
function copyText(text) {
// Create temp element off-screen to hold text.
var tempElem = $('<textarea style="position: absolute; top: -8888px; left: -8888px">');
$("body").append(tempElem);
tempElem.val(text).select();
document.execCommand("copy");
tempElem.remove();
}
// ============================================================================
// Class API
// ============================================================================
return {
copyText: copyText
};
})();
copy