使用javascript将所有浏览器复制到剪贴板

我试图让“复制到剪贴板”在所有浏览器上工作，但没有运气。

我正在使用JavaScript，我不想使用零剪贴板来做。

请让我们知道我的代码有什么问题。

感谢您的帮助。

下面是代码（目前我的代码只能在IE浏览器上运行）： –

<script type="text/javascript"> function copyToClipboard(s) { if( window.clipboardData && clipboardData.setData ) { clipboardData.setData("Text", s); } else { // You have to sign the code to enable this or allow the action in about:config by changing user_pref("signed.applets.codebase_principal_support", true); netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect'); var clip = Components.classes['@mozilla.org/widget/clipboard;[[[[1]]]]'].createInstance(Components.interfaces.nsIClipboard); if (!clip) return; // create a transferable var trans = Components.classes['@mozilla.org/widget/transferable;[[[[1]]]]'].createInstance(Components.interfaces.nsITransferable); if (!trans) return; // specify the data we wish to handle. Plaintext in this case. trans.addDataFlavor('text/unicode'); // To get the data from the transferable we need two new objects var str = new Object(); var len = new Object(); var str = Components.classes["@mozilla.org/supports-string;[[[[1]]]]"].createInstance(Components.interfaces.nsISupportsString); var copytext=meintext; str.data=copytext; trans.setTransferData("text/unicode",str,copytext.length*[[[[2]]]]); var clipid=Components.interfaces.nsIClipboard; if (!clip) return false; clip.setData(trans,null,clipid.kGlobalClipboard); } } </script> <textarea id='testText' rows="10" cols="100">Enter your Sample text</textarea><br /> <button onclick="copyToClipboard(document.getElementById('testText').value);" >clipboard</button><br /><br /> <textarea rows="10" cols="100">Paste your text here</textarea><br /> 

Answer 1

这适用于Firefox 3.6.x和IE：

  function copyToClipboardCrossbrowser(s) { s = document.getElementById(s).value; if( window.clipboardData && clipboardData.setData ) { clipboardData.setData("Text", s); } else { // You have to sign the code to enable this or allow the action in about:config by changing //user_pref("signed.applets.codebase_principal_support", true); netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect'); var clip = Components.classes["@mozilla.org/widget/clipboard;1"].createInstance(Components.interfaces.nsIClipboard); if (!clip) return; // create a transferable var trans = Components.classes["@mozilla.org/widget/transferable;1"].createInstance(Components.interfaces.nsITransferable); if (!trans) return; // specify the data we wish to handle. Plaintext in this case. trans.addDataFlavor('text/unicode'); // To get the data from the transferable we need two new objects var str = new Object(); var len = new Object(); var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString); str.data= s; trans.setTransferData("text/unicode",str, str.data.length * 2); var clipid=Components.interfaces.nsIClipboard; if (!clip) return false; clip.setData(trans,null,clipid.kGlobalClipboard); } } 

Answer 2

我花了很多时间寻找解决这个问题的方法。 这是我迄今为止发现的：

如果您希望用户能够点击某个button并复制一些文本，则可能需要使用Flash。

如果你希望你的用户在页面的任何地方按Ctrl + C，但是总是把xyz复制到剪贴板，我在YUI3中编写了一个全JS解决scheme（虽然它可以很容易地移植到其他框架，或者如果你是感觉特别自我厌恶）。

它涉及在屏幕上创build一个文本框，只要用户点击Ctrl / CMD就会高亮显示。 当他们不久之后打“C”时，他们复制隐藏的文本。 如果他们点击“V”，他们会在粘贴事件触发前被redirect到一个容器（您select的）。

这个方法可以很好地工作，因为当你听到Ctrl / CMD keydown在身体的任何地方，'A'，'C'或'V'keydown监听器只附加到隐藏的文本框（而不是整个身体）。 它也不必打破用户的期望 – 如果您没有select复制任何内容，您只会被redirect到隐藏的框中！

这是我在我的网站上工作，但检查http://at.cg/js/clipboard.js更新，如果有任何：;

 YUI.add('clipboard', function(Y) { // Change this to the id of the text area you would like to always paste in to: pasteBox = Y.one('#pasteDIV'); // Make a hidden textbox somewhere off the page. Y.one('body').append('<input id="copyBox" type="text" name="result" style="position:fixed; top:-20%;" onkeyup="pasteBox.focus()">'); copyBox = Y.one('#copyBox'); // Key bindings for Ctrl+A, Ctrl+C, Ctrl+V, etc: // Catch Ctrl/Window/Apple keydown anywhere on the page. Y.on('key', function(e) { copyData(); // Uncomment below alert and remove keyCodes after 'down:' to figure out keyCodes for other buttons. // alert(e.keyCode); // }, 'body', 'down:', Y); }, 'body', 'down:91,224,17', Y); // Catch V - BUT ONLY WHEN PRESSED IN THE copyBox!!! Y.on('key', function(e) { // Oh no! The user wants to paste, but their about to paste into the hidden #copyBox!! // Luckily, pastes happen on keyPress (which is why if you hold down the V you get lots of pastes), and we caught the V on keyDown (before keyPress). // Thus, if we're quick, we can redirect the user to the right box and they can unload their paste into the appropriate container. phew. pasteBox.select(); }, '#copyBox', 'down:86', Y); // Catch A - BUT ONLY WHEN PRESSED IN THE copyBox!!! Y.on('key', function(e) { // User wants to select all - but he/she is in the hidden #copyBox! That wont do.. select the pasteBox instead (which is probably where they wanted to be). pasteBox.select(); }, '#copyBox', 'down:65', Y); // What to do when keybindings are fired: // User has pressed Ctrl/Meta, and is probably about to press A,C or V. If they've got nothing selected, or have selected what you want them to copy, redirect to the hidden copyBox! function copyData() { var txt = ''; // props to Sabarinathan Arthanari for sharing with the world how to get the selected text on a page, cheers mate! if (window.getSelection) { txt = window.getSelection(); } else if (document.getSelection) { txt = document.getSelection(); } else if (document.selection) { txt = document.selection.createRange().text; } else alert('Something went wrong and I have no idea why - please contact me with your browser type (Firefox, Safari, etc) and what you tried to copy and I will fix this immediately!'); // If the user has nothing selected after pressing Ctrl/Meta, they might want to copy what you want them to copy. if(txt=='') { copyBox.select(); } // They also might have manually selected what you wanted them to copy! How unnecessary! Maybe now is the time to tell them how silly they are..?! else if (txt == copyBox.get('value')) { alert('This site uses advanced copy/paste technology, possibly from the future.\n \nYou do not need to select things manually - just press Ctrl+C! \n \n(Ctrl+V will always paste to the main box too.)'); copyBox.select(); } else { // They also might have selected something completely different! If so, let them. It's only fair. } } }); 

希望其他人认为这有用：]

Answer 3

出于安全原因，大多数浏览器不允许修改剪贴板（当然除IE外）。

使复制到剪贴板function跨浏览器兼容的唯一方法是使用Flash。

Answer 4

我认为zeroclipboard是伟大的。 这个版本使用最新的Flash 11： http : //www.itjungles.com/javascript/javascript-easy-cross-browser-copy-to-clipboard-solution 。