文本复制是在文本输入，如:< input type="text" id="copyText" name="copyText">和，在按钮点击上面的文本应该被复制到剪贴板，所以按钮是像:<button type="submit" id="copy_button" data-clipboard-target='copyText'>复制</button>你的脚本应该像:

<script language="JavaScript">
$(document).ready(function() {
var clip = new ZeroClipboard($("#copy_button"), {
  moviePath: "ZeroClipboard.swf"
}); 
});

</script>

CDN文件

(zeroclipboard.swf): (zeroclipboard.js):

注意:ZeroClipboard.swf和ZeroClipboard.js”文件应该和你使用这个功能的文件在同一个文件夹中，或者你必须包括像我们包括<script src=""></script>在我们的页面上。

2022年6月

更新:现在正确的方法是使用剪贴板API。

例如:

// get the text from the DOM Element: 
const textToCopy = document.querySelector('.content').innerText

// when someone clicks on the <a class="copy-text"> element 
// (which should be a <button>), execute the copy command:
document.querySelector('.copy-text').addEventListener('click' , ()=> {
  navigator.clipboard.writeText(textToCopy).then(
    function() {
      /* clipboard successfully set */
      window.alert('Success! The text was copied to your clipboard') 
    }, 
    function() {
      /* clipboard write failed */
      window.alert('Opps! Your browser does not support the Clipboard API')
    }
  )
})

就是这样。

如果你想看看在Clipboard API引入之前的解决方案(现在不是一个好的实践):

$('button.copyButton').click(function(){
    $(this).siblings('input.linkToCopy').select();      
    document.execCommand("copy");
});

HTML:

<button class="copyButton">click here to copy</button>
<input class="linkToCopy" value="TEXT TO COPY"
style="position: absolute; z-index: -999; opacity: 0;" />

js是一个很好的实用工具，它允许在不使用Flash的情况下将文本或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上。

2016年1月15日编辑:今天编辑了顶部的答案，引用了我在2015年8月发布的答案中的相同API。前面的文本指示用户使用ZeroClipboard。只是想澄清一下，我并没有从jfriend00的答案中抽取这个，而是相反。

纯JS，没有内联onclick，配对类“内容-复制按钮”。如果你有很多元素，会更舒服)

(function(){ /* Creating textarea only once, but not each time */ let area = document.createElement('textarea'); document.body.appendChild( area ); area.style.display = "none"; let content = document.querySelectorAll('.js-content'); let copy = document.querySelectorAll('.js-copy'); for( let i = 0; i < copy.length; i++ ){ copy[i].addEventListener('click', function(){ area.style.display = "block"; /* because the classes are paired, we can use the [i] index from the clicked button, to get the required text block */ area.value = content[i].innerText; area.select(); document.execCommand('copy'); area.style.display = "none"; /* decorative part */ this.innerHTML = 'Cop<span style="color: red;">ied</span>'; /* arrow function doesn't modify 'this', here it's still the clicked button */ setTimeout( () => this.innerHTML = "Copy", 2000 ); }); } })(); hr { margin: 15px 0; border: none; } <span class="js-content">1111</span> <button class="js-copy">Copy</button> <hr> <span class="js-content">2222</span> <button class="js-copy">Copy</button> <hr> <span class="js-content">3333</span> <button class="js-copy">Copy</button>

旧的浏览器支持:

(function(){ var area = document.createElement('textarea'); document.body.appendChild( area ); area.style.display = "none"; var content = document.querySelectorAll('.js-content'); var copy = document.querySelectorAll('.js-copy'); for( var i = 0; i < copy.length; i++ ){ copyOnClick(i); } function copyOnClick(i){ copy[i].addEventListener('click', function(){ area.style.display = "block"; area.value = content[i].innerText; area.select(); document.execCommand('copy'); area.style.display = "none"; var t = this; t.innerHTML = 'Cop<span style="color: red;">ied</span>'; setTimeout( function(){ t.innerHTML = "Copy" }, 2000 ); }); } })(); hr { margin: 15px 0; border: none; } <span class="js-content">1111</span> <button class="js-copy">Copy</button> <hr> <span class="js-content">2222</span> <button class="js-copy">Copy</button> <hr> <span class="js-content">3333</span> <button class="js-copy">Copy</button>

没有flash或任何其他要求的更好方法是clipboard.js。你所需要做的就是在任何按钮上添加data-clipboard-target="#toCopyElement"，初始化它new Clipboard('.btn');它会将id为toCopyElement的DOM内容复制到剪贴板。这是一个片段，通过链接复制您的问题中提供的文本。

虽然有一个限制是它不能在safari上运行，但它可以在所有其他浏览器上运行，包括移动浏览器，因为它不使用flash

$(函数(){ 新剪贴板(“.copy-text”); })； < script src = " https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js " > < /脚本> < script src = " https://cdn.jsdelivr.net/clipboard.js/1.5.12/clipboard.min.js " > < /脚本> <p id="content">Lorem Ipsum只是印刷排版行业的假文本。自16世纪以来，Lorem Ipsum一直是行业标准的虚拟文本 <a class="copy- Text " data-clipboard-target="#content" href="#">copy Text</a>

<div class="form-group">
    <label class="font-normal MyText">MyText to copy</label>&nbsp;
    <button type="button" class="btn btn-default btn-xs btnCopy" data="MyText">Copy</button>
</div>


$(".btnCopy").click(function () {
        var element = $(this).attr("data");
        copyToClipboard($('.' + element));
  });

function copyToClipboard(element) {
    var $temp = $("<input>");
    $("body").append($temp);
    $temp.val($(element).text()).select();
    document.execCommand("copy");
    $temp.remove();
}