blocks|key|1529587|text|出于安全原因，Firefox不允许您在剪贴板上放置文本。但是，使用Flash有一种解决方法。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1529588|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="'+%2B
++++++++clipboardSWF+%2B
++++++++'"+FlashVars="clipboard='+%2B+encodeURIComponent(text)+%2B
++++++++'"+width="0"+height="0"+type="application/x-shockwave-flash"></embed>';
++++document.getElementById(flashId).innerHTML+=+content;
}|code-block|syntax|javascript|1529589|唯一的缺点是这需要启用Flash。|1529590|源代码目前是死的：http://bravo9.com/journal/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2-cc6c-4ebf-9724-d23e8bc5ad8a/+(它的Google+cache也是如此)|offset|length|1529591|entityMap|0|LINK|mutability|MUTABLE|url|http://bravo9.com/journal/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2-cc6c-4ebf-9724-d23e8bc5ad8a/|1|http://webcache.googleusercontent.com/search?q=cache:DaMt_LgPWUYJ:rokr-blargh.appspot.com/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2cc6c4ebf9724d23e8bc5ad8a%2520&cd=1&hl=en&ct=clnk&gl=us^0|0|0|0|9|3U|0|47|C|1|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|X|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Y|8|@]|9|@]|A|$]]|$1|I|3|J|5|6|7|Z|8|@]|9|@$K|10|L|11|1|12]|$K|13|L|14|1|15]]|A|$]]|$1|M|3|-4|5|6|7|16|8|@]|9|@]|A|$]]]|N|$O|$5|P|Q|R|A|$S|T]]|U|$5|P|Q|R|A|$S|V]]]]

<p>For security reasons, Firefox doesn't allow you to place text on the clipboard. However, there is a workaround available using Flash.</p>
<pre><code>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 = '&lt;embed src=&quot;' +
        clipboardSWF +
        '&quot; FlashVars=&quot;clipboard=' + encodeURIComponent(text) +
        '&quot; width=&quot;0&quot; height=&quot;0&quot; type=&quot;application/x-shockwave-flash&quot;&gt;&lt;/embed&gt;';
    document.getElementById(flashId).innerHTML = content;
}
</code></pre>
<p>The only disadvantage is that this requires Flash to be enabled.</p>
<p>The source is currently dead: <a href="http://bravo9.com/journal/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2-cc6c-4ebf-9724-d23e8bc5ad8a/" rel="nofollow noreferrer">http://bravo9.com/journal/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2-cc6c-4ebf-9724-d23e8bc5ad8a/</a> (and so is its <a href="http://webcache.googleusercontent.com/search?q=cache:DaMt_LgPWUYJ:rokr-blargh.appspot.com/copying-text-into-the-clipboard-with-javascript-in-firefox-safari-ie-opera-292559a2cc6c4ebf9724d23e8bc5ad8a%20&amp;cd=1&amp;hl=en&amp;ct=clnk&amp;gl=us" rel="nofollow noreferrer">Google cache</a>)</p>


blocks|key|1744577|text|Firefox确实允许你在剪贴板中存储数据，但由于安全隐患，默认情况下它是禁用的。在Mozilla+Firefox知识库中查看如何在"Granting+JavaScript+access+to+the+clipboard"中启用它。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1744578|如果你有很多用户，并且不能配置他们的浏览器，那么amdfan提供的解决方案是最好的。不过，如果用户精通技术，您可以测试剪贴板是否可用，并提供更改设置的链接。JavaScript编辑器TinyMCE遵循这种方法。|1744579|entityMap|0|LINK|mutability|MUTABLE|url|http://support.mozilla.com/en-US/kb/Granting%2BJavaScript%2Baccess%2Bto%2Bthe%2Bclipboard|1|http://tinymce.moxiecode.com/^0|1U|19|0|0|2J|7|1|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@$A|Q|B|R|1|S]]|C|$]]|$1|D|3|E|5|6|7|T|8|@]|9|@$A|U|B|V|1|W]]|C|$]]|$1|F|3|-4|5|6|7|X|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]|N|$5|I|J|K|C|$L|O]]]]

<p>Firefox does allow you to store data in the clipboard, but due to security implications it is disabled by default. See how to enable it in <a href="http://support.mozilla.com/en-US/kb/Granting+JavaScript+access+to+the+clipboard" rel="noreferrer">"Granting JavaScript access to the clipboard"</a> in the Mozilla Firefox knowledge base.</p>

<p>The solution offered by amdfan is the best if you are having a lot of users and configuring their browser isn't an option. Though you could test if the clipboard is available and provide a link for changing the settings, if the users are tech savvy. The JavaScript editor <a href="http://tinymce.moxiecode.com/" rel="noreferrer">TinyMCE</a> follows this approach.</p>


blocks|key|1744645|text|copyIntoClipboard()函数适用于Flash9，但随着Flash+player+10的发布，它似乎被打破了。下面是一个适用于新的Flash+player的解决方案：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1744646|http://bowser.macminicolo.net/~jhuckaby/zeroclipboard/|offset|length|1744647|这是一个复杂的解决方案，但它确实有效。|1744648|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|1I|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@$D|Q|E|R|1|S]]|A|$]]|$1|F|3|G|5|6|7|T|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|U|8|@]|9|@]|A|$]]]|I|$J|$5|K|L|M|A|$N|C]]]]

<p>The copyIntoClipboard() function works for Flash 9, but it appears to be broken by the release of Flash player 10.  Here's a solution that does work with the new flash player:</p>

<p><a href="http://bowser.macminicolo.net/~jhuckaby/zeroclipboard/" rel="noreferrer">http://bowser.macminicolo.net/~jhuckaby/zeroclipboard/</a></p>

<p>It's a complex solution, but it does work.</p>


blocks|key|1529807|text|对Flash解决方案的一个轻微改进是使用swfobject检测Flash+10：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1529808|http://code.google.com/p/swfobject/|offset|length|1529809|如果显示为Flash10，请尝试使用JavaScript加载Shockwave对象。Shockwave还可以使用Lingo中的copyToClipboard()命令对剪贴板进行读/写(在所有版本中)。|1529810|entityMap|0|LINK|mutability|MUTABLE|url|1|https://en.wikipedia.org/wiki/Lingo_(programming_language))^0|0|0|Z|0|0|1K|5|1|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@]|9|@$D|S|E|T|1|U]]|A|$]]|$1|F|3|G|5|6|7|V|8|@]|9|@$D|W|E|X|1|Y]]|A|$]]|$1|H|3|-4|5|6|7|Z|8|@]|9|@]|A|$]]]|I|$J|$5|K|L|M|A|$N|C]]|O|$5|K|L|M|A|$N|P]]]]

<p>A slight improvement on the Flash solution is to detect for Flash 10 using swfobject:</p>
<p><a href="http://code.google.com/p/swfobject/" rel="nofollow noreferrer">http://code.google.com/p/swfobject/</a></p>
<p>And then if it shows as Flash 10, try loading a Shockwave object using JavaScript. Shockwave can read/write to the clipboard (in all versions) as well using the copyToClipboard() command in <a href="https://en.wikipedia.org/wiki/Lingo_(programming_language)" rel="nofollow noreferrer">Lingo</a>.</p>


blocks|key|1744818|text|http://www.rodsdot.com/ee/cross_browser_clipboard_copy_with_pop_over_message.asp适用于Flash10和所有支持Flash的浏览器。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1744819|此外，ZeroClipboard也进行了更新，以避免提到的关于页面滚动导致Flash电影不再位于正确位置的错误。|1744820|因为该方法“要求”用户点击按钮来复制，所以这对用户来说是方便，且不会发生任何恶意行为。|1744821|entityMap|0|LINK|mutability|MUTABLE|url|http://www.rodsdot.com/ee/cross_browser_clipboard_copy_with_pop_over_message.asp^0|0|28|0|0|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@$A|Q|B|R|1|S]]|C|$]]|$1|D|3|E|5|6|7|T|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|U|8|@]|9|@]|C|$]]|$1|H|3|-4|5|6|7|V|8|@]|9|@]|C|$]]]|I|$J|$5|K|L|M|C|$N|O]]]]

<p><a href="http://www.rodsdot.com/ee/cross_browser_clipboard_copy_with_pop_over_message.asp" rel="nofollow noreferrer">http://www.rodsdot.com/ee/cross_browser_clipboard_copy_with_pop_over_message.asp</a> works with Flash 10 and all Flash enabled browsers.</p>

<p>Also ZeroClipboard has been updated to avoid the bug mentioned about page scrolling causing the Flash movie to no longer be in the correct place.</p>

<p>Since that method "Requires" the user to click a button to copy this is a convenience to the user and nothing nefarious is occurring.</p>


blocks|key|1529951|text|尝试创建存储选择的内存全局变量。然后，另一个函数可以访问该变量并进行粘贴。例如,|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1529952|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)+%2B+memory+%2B+DOMEle.value.slice(newpos);
}|code-block|syntax|javascript|1529953|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

<p>Try creating a memory global variable storing the selection. Then the other function can access the variable and do a paste. For example,</p>
<pre><code>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);
}
</code></pre>


blocks|key|1744952|text|这是2015年夏天，在围绕Flash的如此多的混乱中，这里是如何完全避免使用它的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1744953|clipboard.js是一个很好的工具，允许将文本或html数据复制到剪贴板。它非常容易使用，只需包含.js并使用如下所示：|offset|length|1744954|<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>|code-block|syntax|javascript|1744955|clipboard.js也是on+GitHub。|1744956|entityMap|0|LINK|mutability|MUTABLE|url|https://www.npmjs.com/package/clipboard-js|1|https://github.com/lgarron/clipboard.js^0|0|0|C|0|0|0|E|9|1|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|X|8|@]|9|@$D|Y|E|Z|1|10]]|A|$]]|$1|F|3|G|5|H|7|11|8|@]|9|@]|A|$I|J]]|$1|K|3|L|5|6|7|12|8|@]|9|@$D|13|E|14|1|15]]|A|$]]|$1|M|3|-4|5|6|7|16|8|@]|9|@]|A|$]]]|N|$O|$5|P|Q|R|A|$S|T]]|U|$5|P|Q|R|A|$S|V]]]]

<p>It is summer 2015, and with so much turmoil surrounding Flash, here is how to avoid its use altogether.</p>
<p><a href="https://www.npmjs.com/package/clipboard-js" rel="nofollow noreferrer">clipboard.js</a> is a nice utility that allows copying of text or html data to the clipboard.  It's very easy to use, just include the .js and use something like this:</p>
<pre><code>&lt;button id='markup-copy'&gt;Copy Button&lt;/button&gt;

&lt;script&gt;
document.getElementById('markup-copy').addEventListener('click', function() {
  clipboard.copy({
    'text/plain': 'Markup text. Paste me into a rich text editor.',
    'text/html': '&lt;i&gt;here&lt;/i&gt; is some &lt;b&gt;rich text&lt;/b&gt;'
  }).then(
    function(){console.log('success'); },
    function(err){console.log('failure', err);
  });

});
&lt;/script&gt;
</code></pre>
<p>clipboard.js is also <a href="https://github.com/lgarron/clipboard.js" rel="nofollow noreferrer">on GitHub</a>.</p>


blocks|key|1745025|text|现在有一种方法可以在大多数现代浏览器中轻松实现这一点，使用|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1745026|document.execCommand('copy');|code-block|syntax|javascript|1745027|这将复制当前选定的文本。您可以使用以下命令选择textArea或输入字段|1745028|document.getElementById('myText').select();|1745029|要以不可见的方式复制文本，您可以快速生成textArea，修改框中的文本，选择它，复制它，然后删除该textArea。在大多数情况下，这个textArea甚至不会闪现到屏幕上。|1745030|出于安全原因，浏览器将只允许您复制，如果用户采取了某种行动(即。点击按钮)。一种方法是将onClick事件添加到html按钮，该按钮调用复制文本的方法。|1745031|完整的示例：|1745032|​|1745033|function+copier(){
++document.getElementById('myText').select();
++document.execCommand('copy');
}|1745034|<button+onclick="copier()">Copy</button>
<textarea+id="myText">Copy+me+PLEASE!!!</textarea>|1745035|1745036|entityMap^0|0|0|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|Z|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|10|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|11|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|12|8|@]|9|@]|A|$E|F]]|$1|K|3|L|5|6|7|13|8|@]|9|@]|A|$]]|$1|M|3|N|5|6|7|14|8|@]|9|@]|A|$]]|$1|O|3|P|5|6|7|15|8|@]|9|@]|A|$]]|$1|Q|3|R|5|6|7|16|8|@]|9|@]|A|$]]|$1|S|3|T|5|D|7|17|8|@]|9|@]|A|$E|F]]|$1|U|3|V|5|D|7|18|8|@]|9|@]|A|$E|F]]|$1|W|3|R|5|6|7|19|8|@]|9|@]|A|$]]|$1|X|3|-4|5|6|7|1A|8|@]|9|@]|A|$]]]|Y|$]]

<p>There is now a way to easily do this in most modern browsers using  </p>

<pre><code>document.execCommand('copy');
</code></pre>

<p>This will copy currently selected text. You can select a textArea or input field using</p>

<pre><code>document.getElementById('myText').select();
</code></pre>

<p>To invisibly copy text you can quickly generate a textArea, modify the text in the box, select it, copy it, and then delete the textArea. In most cases this textArea wont even flash onto the screen. </p>

<p>For security reasons, browsers will only allow you copy if a user takes some kind of action (ie. clicking a button). One way to do this would be to add an onClick event to a html button that calls a method which copies the text. </p>

<p>A full example:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function copier(){
  document.getElementById('myText').select();
  document.execCommand('copy');
}</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;button onclick="copier()"&gt;Copy&lt;/button&gt;
&lt;textarea id="myText"&gt;Copy me PLEASE!!!&lt;/textarea&gt;</code></pre>
</div>
</div>
</p>


blocks|key|1745102|text|使用document.execCommand('copy')。最新版本的Chrome、Firefox、Edge和Safari都支持它。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1745103|​|1745104|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);
})|code-block|syntax|javascript|1745105|<input+id="txt"+value="Hello+World!"+/>
<button+id="btn">Copy+To+Clipboard</button>|1745106|1745107|entityMap^0|2|S|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@$9|S|A|T|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|U|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|V|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|J|7|W|8|@]|D|@]|E|$K|L]]|$1|O|3|G|5|6|7|X|8|@]|D|@]|E|$]]|$1|P|3|-4|5|6|7|Y|8|@]|D|@]|E|$]]]|Q|$]]

<p>Use <code>document.execCommand('copy')</code>. It is supported in the latest versions of Chrome, Firefox, Edge, and Safari.</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>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);
})</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;input id="txt" value="Hello World!" /&gt;
&lt;button id="btn"&gt;Copy To Clipboard&lt;/button&gt;</code></pre>
</div>
</div>
</p>


blocks|key|1745156|text|使用现代的document.execCommand(“复制”)和jQuery。参见this+Stack Overflow+answer。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|1745157|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();
++++}
};|code-block|syntax|javascript|1745158|如何调用它：|1745159|ClipboardHelper.copyText('Hello\nWorld');
ClipboardHelper.copyElement($('body+h1').first());|1745160|​|1745161|//+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+);|1745162|<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>|1745163|1745164|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/22581345/click-button-copy-to-clipboard-using-jquery/41545988#41545988^0|15|Q|0|0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|11|8|@]|9|@$A|12|B|13|1|14]]|C|$]]|$1|D|3|E|5|F|7|15|8|@]|9|@]|C|$G|H]]|$1|I|3|J|5|6|7|16|8|@]|9|@]|C|$]]|$1|K|3|L|5|F|7|17|8|@]|9|@]|C|$G|H]]|$1|M|3|N|5|6|7|18|8|@]|9|@]|C|$]]|$1|O|3|P|5|F|7|19|8|@]|9|@]|C|$G|H]]|$1|Q|3|R|5|F|7|1A|8|@]|9|@]|C|$G|H]]|$1|S|3|N|5|6|7|1B|8|@]|9|@]|C|$]]|$1|T|3|-4|5|6|7|1C|8|@]|9|@]|C|$]]]|U|$V|$5|W|X|Y|C|$Z|10]]]]

<p>Use the modern document.execCommand(&quot;copy&quot;) and jQuery. See <a href="https://stackoverflow.com/questions/22581345/click-button-copy-to-clipboard-using-jquery/41545988#41545988">this Stack Overflow answer</a>.</p>
<pre><code>var ClipboardHelper = { // As Object

    copyElement: function ($element)
    {
        this.copyText($element.text())
    },
    copyText:function(text) // Linebreaks with \n
    {
        var $tempInput =  $(&quot;&lt;textarea&gt;&quot;);
        $(&quot;body&quot;).append($tempInput);
        $tempInput.val(text).select();
        document.execCommand(&quot;copy&quot;);
        $tempInput.remove();
    }
};
</code></pre>
<p>How to call it:</p>
<pre><code>ClipboardHelper.copyText('Hello\nWorld');
ClipboardHelper.copyElement($('body h1').first());
</code></pre>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>// jQuery document
;(function ( $, window, document, undefined ) {

    var ClipboardHelper = {

        copyElement: function ($element)
        {
           this.copyText($element.text())
        },
        copyText:function(text) // Linebreaks with \n
        {
            var $tempInput =  $("&lt;textarea&gt;");
            $("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 );</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;

&lt;span data-copy-text-to-clipboard=
    "Hello
     World"&gt;
    Copy Text
&lt;/span&gt;

&lt;br&gt;&lt;br&gt;
&lt;span class="js-copy-element-to-clipboard"&gt;
    Hello
    World
    Element
&lt;/span&gt;</code></pre>
</div>
</div>
</p>


blocks|key|1745222|text|自2017年起，您可以这样做：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1745223|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');
}|code-block|syntax|javascript|1745224|现在来复制copyStringToClipboard('Hello,+World!')|offset|length|style|CODE|1745225|如果您注意到setData行，并想知道是否可以设置不同的数据类型，答案是肯定的。|1745226|entityMap^0|0|0|5|12|0|6|7|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|R|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|S|8|@$I|T|J|U|K|L]]|9|@]|A|$]]|$1|M|3|N|5|6|7|V|8|@$I|W|J|X|K|L]]|9|@]|A|$]]|$1|O|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|P|$]]

<p>As of 2017, you can do this:</p>
<pre><code>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');
}
</code></pre>
<p>And now to copy <code>copyStringToClipboard('Hello, World!')</code></p>
<p>If you noticed the <code>setData</code> line, and wondered if you can set different data types, the answer is yes.</p>


blocks|key|1530354|text|Clipboard+API旨在取代document.execCommand。Safari仍在努力提供支持，因此您应该在规范确定和Safari完成实现之前提供一个后备方案。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1530355|​|1530356|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';
++});
};|code-block|syntax|javascript|1530357|<a+href="https://stackoverflow.com/questions/127040/"+rel="bookmark">Permalink</a>
<output></output>|1530358|1530359|出于安全原因，可能需要从剪贴板读取和写入剪贴板Permissions。如果代码片段在Stack+Overflow上不起作用，那就在localhost或其他受信任的域上尝试一下。|1530360|entityMap|0|LINK|mutability|MUTABLE|url|https://devdocs.io/dom/clipboard_api|1|https://devdocs.io/dom/document/execcommand|2|https://w3c.github.io/permissions/|3|https://en.wikipedia.org/wiki/Localhost^0|H|K|0|D|0|H|K|1|0|0|0|0|0|N|B|N|B|2|1T|9|3|0^^$0|@$1|2|3|4|5|6|7|15|8|@$9|16|A|17|B|C]]|D|@$9|18|A|19|1|1A]|$9|1B|A|1C|1|1D]]|E|$]]|$1|F|3|G|5|6|7|1E|8|@]|D|@]|E|$]]|$1|H|3|I|5|J|7|1F|8|@]|D|@]|E|$K|L]]|$1|M|3|N|5|J|7|1G|8|@]|D|@]|E|$K|L]]|$1|O|3|G|5|6|7|1H|8|@]|D|@]|E|$]]|$1|P|3|Q|5|6|7|1I|8|@$9|1J|A|1K|B|C]]|D|@$9|1L|A|1M|1|1N]|$9|1O|A|1P|1|1Q]]|E|$]]|$1|R|3|-4|5|6|7|1R|8|@]|D|@]|E|$]]]|S|$T|$5|U|V|W|E|$X|Y]]|Z|$5|U|V|W|E|$X|10]]|11|$5|U|V|W|E|$X|12]]|13|$5|U|V|W|E|$X|14]]]]

<p><a href="https://devdocs.io/dom/clipboard_api" rel="nofollow noreferrer">Clipboard API</a> is designed to supersede <a href="https://devdocs.io/dom/document/execcommand" rel="nofollow noreferrer"><code>document.execCommand</code></a>. Safari is still working on support, so you should provide a fallback until the specification settles and Safari finishes implementation.</p>
<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>const permalink = document.querySelector('[rel="bookmark"]');
const output = document.querySelector('output');
permalink.onclick = evt =&gt; {
  evt.preventDefault();
  window.navigator.clipboard.writeText(
    permalink.href
  ).then(() =&gt; {
    output.textContent = 'Copied';
  }, () =&gt; {
    output.textContent = 'Not copied';
  });
};</code></pre>
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;a href="https://stackoverflow.com/questions/127040/" rel="bookmark"&gt;Permalink&lt;/a&gt;
&lt;output&gt;&lt;/output&gt;</code></pre>
</div>
</div>
</p>
<p>For security reasons clipboard <a href="https://w3c.github.io/permissions/" rel="nofollow noreferrer"><code>Permissions</code></a> may be necessary to read and write from the clipboard. If the snippet doesn't work on Stack Overflow give it a shot on <a href="https://en.wikipedia.org/wiki/Localhost" rel="nofollow noreferrer">localhost</a> or an otherwise trusted domain.</p>


blocks|key|1530399|text|它建立在优秀的answer+from+David+from+Studio.201之上，可以在Safari，Firefox和Chrome上运行。它还可以通过将textarea放在屏幕外来确保不会发生闪烁。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|1530400|//+================================================================================
//+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
++++};
})();|code-block|syntax|javascript|1530401|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/127040/copy-put-text-on-the-clipboard-with-firefox-safari-and-chrome/41546309#41546309^0|26|8|7|X|0|0|0^^$0|@$1|2|3|4|5|6|7|S|8|@$9|T|A|U|B|C]]|D|@$9|V|A|W|1|X]]|E|$]]|$1|F|3|G|5|H|7|Y|8|@]|D|@]|E|$I|J]]|$1|K|3|-4|5|6|7|Z|8|@]|D|@]|E|$]]]|L|$M|$5|N|O|P|E|$Q|R]]]]

<p>Building off the excellent <a href="https://stackoverflow.com/questions/127040/copy-put-text-on-the-clipboard-with-firefox-safari-and-chrome/41546309#41546309">answer from David from Studio.201</a>, this works in Safari, Firefox, and Chrome. It also ensures no flashing could occur from the <code>textarea</code> by placing it off-screen.</p>
<pre><code>// ================================================================================
// ClipboardClass
// ================================================================================
var ClipboardClass = (function() {

    function copyText(text) {
        // Create temp element off-screen to hold text.
        var tempElem = $('&lt;textarea style=&quot;position: absolute; top: -8888px; left: -8888px&quot;&gt;');
        $(&quot;body&quot;).append(tempElem);

        tempElem.val(text).select();
        document.execCommand(&quot;copy&quot;);
        tempElem.remove();
    }


    // ============================================================================
    // Class API
    // ============================================================================
    return {
        copyText: copyText
    };
})();
</code></pre>


<p>In Internet Explorer I can use the clipboardData object to access the clipboard. How can I do that in FireFox, Safari and/or Chrome?</p>


Copy / Put text on the clipboard with FireFox, Safari and Chrome

jQuery

在Internet Explorer中，我可以使用clipboardData对象访问剪贴板。我如何在FireFox，Safari和/或Chrome中做到这一点？

问使用FireFox、Safari和Chrome在剪贴板上复制/放置文本
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用FireFox、Safari和Chrome在剪贴板上复制/放置文本EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问使用FireFox、Safari和Chrome在剪贴板上复制/放置文本
EN