Internet Explorer では、clipboardData オブジェクトを使用してクリップボードにアクセスできます。FireFox、Safari、および/またはChromeでそれを行うにはどうすればよいですか?
19 に答える
セキュリティ上の理由から、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;
}
唯一の欠点は、Flash を有効にする必要があることです。
ソースは現在死んでいます: http://bravo9.com/journal/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2-cc6c-4ebf-9724-d23e8bc5ad8a/(そしてそのGoogleキャッシュもそうです)
オンライン スプレッドシート アプリケーションは、 + イベントと +イベントCtrlをフックし、非表示の TextArea コントロールにフォーカスを移し、その内容を目的の新しいクリップボードの内容に設定してコピーするか、イベントの終了後にその内容を読み取って貼り付けます。CCtrlV
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 にあります。
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 の仕組みは、ページの要素の上に不可視のフラッシュ オブジェクトを配置することです。要素が移動すると (ユーザーがウィンドウのサイズを変更し、物事を正しく配置した場合など)、ZeroClipboard フラッシュ オブジェクトが暴走し、オブジェクトをカバーしなくなることがわかりました。多分、元の場所に残っていると思います。彼らはそれを止めるか、要素に貼り直すはずのコードを持っていますが、うまく機能していないようです。
ということで…BlogTrog の次のバージョンでは、私が実際に目にした他のすべてのコード ハイライターに倣い、[クリップボードにコピー] ボタンを削除すると思います。:-(
(dp.syntaxhiglighter のクリップボードへのコピーも壊れていることに気付きました。)
このリンクを確認してください:
JavaScript にクリップボードへのアクセスを許可する
誰もが言ったように、セキュリティ上の理由から、デフォルトでは無効になっています。上記のページは、それを有効にする方法の手順を示しています ( Firefox またはuser.jsファイルでabout:configを編集することによって)。
幸いなことに、「AllowClipboardHelper」というプラグインがあり、数回クリックするだけで作業が簡単になります。ただし、Web サイトの訪問者に、Firefox でアクセスを有効にする方法を説明する必要があります。
私は必要に応じて GitHub のClippyを使用しました。これはシンプルな Flash ベースのボタンです。スタイリングを必要とせず、サーバー側に何を貼り付けるかをあらかじめ挿入しておけば、問題なく動作します。
Flashソリューションのわずかな改善は、swfobjectを使用してFlash10を検出することです。
http://code.google.com/p/swfobject/
そして、Flash 10と表示されている場合は、JavaScriptを使用してShockwaveオブジェクトをロードしてみてください。Shockwaveは、 LingoのcopyToClipboard()コマンドを使用して、クリップボード(すべてのバージョン)に対して読み取り/書き込みを行うこともできます。
を使用し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>
Flash をサポートしている場合は、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 のテキストと URL を使用して、getData と setData を実行できます。
データを削除するには:
DataFormat のファイル、HTML、画像、テキスト、および URL を使用できます。PS: を使用する必要がありますwindow.clipboardData.clearData(DataFormat);
。
また、window.clipboardData および swf Flash ファイルをサポートしていないその他のファイルについては、Windows の場合はキーボードのControl+ボタン、Mac の場合は+を使用することもできます。CCommandC
選択内容を格納するメモリ グローバル変数を作成してみてください。次に、他の関数が変数にアクセスして貼り付けを実行できます。例えば、
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);
}
http://www.rodsdot.com/ee/cross_browser_clipboard_copy_with_pop_over_message.aspは、Flash 10 およびすべての Flash 対応ブラウザで動作します。
また、ZeroClipboard が更新され、ページのスクロールで Flash ムービーが正しい場所に表示されなくなるというバグが回避されました。
この方法では、ユーザーがボタンをクリックしてコピーする必要があるため、これはユーザーにとって便利であり、悪意はありません。