Existe outra forma não-Flash (para além da API da área de transferência mencionada na resposta do jfriend00 ). Você precisa selecionar o texto e então executar o comando copy para copiar para a área de transferência qualquer texto que esteja seleccionado de momento na página.

Por exemplo, esta função irá copiar o conteúdo do elemento passado para a área de transferência (actualizado com a sugestão nos comentários de PointZeroTwo):

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

1. cria um campo de texto escondido temporário.
2. copia o conteúdo do elemento para esse campo de texto.
3. selecciona o conteúdo do campo de texto.
4. executa a cópia do comando como: document.execCommand("copy").
5. remove o campo de texto temporário.

Pode ver uma demonstração rápida aqui:

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

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p id="p1">P1: I am paragraph 1</p>
<p id="p2">P2: I am a second paragraph</p>
<button onclick="copyToClipboard('#p1')">Copy P1</button>
<button onclick="copyToClipboard('#p2')">Copy P2</button>
<br/><br/><input type="text" placeholder="Paste here for test" />

A questão principal é que nem todos os navegadores suportamEste recurso no momento, mas você pode usá-lo nos principais de:

• cromado 43
• Internet Explorer 10
• Firefox 41
• Safari 10

Actualização 1: isto também pode ser conseguido com uma solução JavaScript pura (sem jQuery):

function copyToClipboard(elementId) {

  // Create a "hidden" input
  var aux = document.createElement("input");

  // Assign it the value of the specified element
  aux.setAttribute("value", document.getElementById(elementId).innerHTML);

  // Append it to the body
  document.body.appendChild(aux);

  // Highlight its content
  aux.select();

  // Copy the highlighted text
  document.execCommand("copy");

  // Remove it from the body
  document.body.removeChild(aux);

}

<p id="p1">P1: I am paragraph 1</p>
<p id="p2">P2: I am a second paragraph</p>
<button onclick="copyToClipboard('p1')">Copy P1</button>
<button onclick="copyToClipboard('p2')">Copy P2</button>
<br/><br/><input type="text" placeholder="Paste here for test" />

Comomadzohan relatado nos comentários abaixo, há um problema estranho com a versão de 64 bits de Google Chrome em alguns casos (executando o arquivo localmente). Esta questão parece ser resolvida com a solução não-jQuery acima.

Madzohan tentou em Safari e a solução funcionou, mas usando document.execCommand('SelectAll') em vez de usar .select() (conforme especificado no chat e nos comentários abaixo).

Como PointZeroTwo aponta nos comentários , o código poderia ser melhorado para que ele retornasse um resultado de sucesso / fracasso. Você pode ver uma demo neste jsFiddle.

Actualização: COPIAR MANTENDO O FORMATO DE TEXTO

Como usuário apontou a versão em espanhol do StackOverflow, as soluções listadas acima funciona perfeitamente se você deseja copiar o conteúdo de um elemento, literalmente, mas eles não são grande se você deseja colar o texto copiado com o formato (como ele é copiado para um input type="text", o formato de "lost").

Uma solução para isso seria copiar para um conteúdo editável div e, em seguida, copiá-lo usando o execCommand de uma forma semelhante. Aqui está. um exemplo-carregue no botão Copiar e depois cole na caixa de edição do conteúdo abaixo:

function copy(element_id){
  var aux = document.createElement("div");
  aux.setAttribute("contentEditable", true);
  aux.innerHTML = document.getElementById(element_id).innerHTML;
  aux.setAttribute("onfocus", "document.execCommand('selectAll',false,null)"); 
  document.body.appendChild(aux);
  aux.focus();
  document.execCommand("copy");
  document.body.removeChild(aux);
}

#target {
  width:400px;
  height:100px;
  border:1px solid #ccc;
}

<p id="demo"><b>Bold text</b> and <u>underlined text</u>.</p>
<button onclick="copy('demo')">Copy Keeping Format</button> 

<div id="target" contentEditable="true"></div>

function copy(selector){
  var $temp = $("<div>");
  $("body").append($temp);
  $temp.attr("contenteditable", true)
       .html($(selector).html()).select()
       .on("focus", function() { document.execCommand('selectAll',false,null) })
       .focus();
  document.execCommand("copy");
  $temp.remove();
}

#target {
  width:400px;
  height:100px;
  border:1px solid #ccc;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<p id="demo"><b>Bold text</b> and <u>underlined text</u>.</p>
<button onclick="copy('#demo')">Copy Keeping Format</button> 

<div id="target" contentEditable="true"></div>

Área de transferência.o js é um utilitário simpático que permite a cópia de dados de texto ou HTML para a área de transferência sem o uso do Flash. É muito fácil de usar, apenas inclua o .JS e usar algo assim:

<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>

Área de transferência.js também está em GitHub .

Edite em 15 de Janeiro de 2016: a resposta de topo foi editada hoje para referenciar a mesma API na minha resposta publicada em agosto de 2015. O texto anterior estava instruindo os usuários a usar ZeroClipboard. Só quero ser claro que não tirei isto da resposta do jfriend00, ao contrário.

Com quebra de linha (Extensão da resposta de Alvaro Montoro)

var ClipboardHelper = {

    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());

Uma aproximação ainda melhor sem flash ou quaisquer outros requisitos é área de transferência.js . Tudo o que você precisa fazer é adicionar data-clipboard-target="#toCopyElement" em qualquer botão, inicializá-lo new Clipboard('.btn'); e ele irá copiar o conteúdo do DOM com o id toCopyElement para a área de transferência. Este é um excerto que copia o texto fornecido na sua pergunta através de um link.

Uma limitação no entanto é que não funciona em safari, mas funciona em todos os outros navegadores, incluindo navegadores móveis, uma vez que não utiliza flash

$(function(){
  new Clipboard('.copy-text');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.12/clipboard.min.js"></script>

<p id="content">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p>

<a class="copy-text" data-clipboard-target="#content" href="#">copy Text</a>

É um método mais simples para copiar o conteúdo

 <div id="content"> Lorepm ispum </div>
 <button class="copy" title="content">Copy Sorce</button>

function SelectContent(element) {
                        var doc = document
                            , text = doc.getElementById(element)
                            , range, selection
                        ;    
                        if (doc.body.createTextRange) {
                            range = document.body.createTextRange();
                            range.moveToElementText(text);
                            range.select();
                        } else if (window.getSelection) {
                            selection = window.getSelection();        
                            range = document.createRange();
                            range.selectNodeContents(text);
                            selection.removeAllRanges();
                            selection.addRange(range);

                        }
                         document.execCommand('Copy');
                    }
                    $(".copy").click(function(){

                         SelectContent( $(this).attr('title'));
                    });

<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();
}

$('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;"><input>

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link href="css/index.css" rel="stylesheet" />
    <script src="js/jquery-2.1.4.min.js"></script>
    <script>
        function copy()
        {
            try
            {
                $('#txt').select();
                document.execCommand('copy');
            }
            catch(e)
            {
                alert(e);
            }
        }
    </script>
</head>
<body>
    <h4 align="center">Copy your code</h4>
    <textarea id="txt" style="width:100%;height:300px;"></textarea>
    <br /><br /><br />
    <div align="center"><span class="btn-md" onclick="copy();">copy</span></div>
</body>
</html>

Você pode apenas usar este lib para realizar facilmente o objetivo de cópia!

Https://clipboardjs.com/

Copiar o texto para a área de transferência não deve ser difícil. Não deve exigir dezenas de passos para configurar ou centenas de KBs para carregar. Mas a maior parte tudo, não deve depender do Flash ou de qualquer estrutura inchada.

É por isso que a área de transferência.js existir.

Ou

Https://github.com/zeroclipboard/zeroclipboard

Http://zeroclipboard.org/

A Biblioteca ZeroClipboard oferece uma forma fácil de copiar o texto para a área de transferência com um filme invisível do Adobe Flash e um JavaScript interface.

O texto a Copiar está na entrada de texto, como: <input type="text" id="copyText" name="copyText"> e, se carregar no botão acima do texto, deverá ser copiado para a área de transferência, por isso o botão é do tipo: <button type="submit" id="copy_button" data-clipboard-target='copyText'>Copy</button> o seu programa deve ser do tipo:

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

</script>

Para ficheiros CDN

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

nota: ZeroClipboard.swf e ZeroClipboard.js " arquivo deve estar na mesma pasta que o seu arquivo usando esta funcionalidade é, ou você tem que incluir como nós incluímos <script src=""></script> em nosso pagina.

Código Html aqui

    <input id="result" style="width:300px"/>some example text
    <button onclick="copyToClipboard('result')">Copy P1</button>
    <input type="text" style="width:400px" placeholder="Paste here for test" />

CÓDIGO JS:

     function copyToClipboard(elementId) {

                      // Create a "hidden" input
                      var aux = document.createElement("input");

                      aux.setAttribute("value", document.getElementById(elementId).value);
                      // Append it to the body
                      document.body.appendChild(aux);
                      // Highlight its content
                      aux.select();
                      // Copy the highlighted text
                      document.execCommand("copy");
                      // Remove it from the body
                      document.body.removeChild(aux);
                    }

A maioria das respostas propostas criam um(S) elemento (s) de entrada escondido (s) temporário (s). Como a maioria dos navegadores hoje em dia suportam a edição de conteúdo div, eu proponho uma solução que não cria elementos ocultos, preservar a formatação de texto e usar JavaScript puro ou biblioteca jQuery.

//Pure javascript implementation:
document.getElementById("copyUsingPureJS").addEventListener("click", function() {
  copyUsingPureJS(document.getElementById("copyTarget"));
  alert("Text Copied to Clipboard Using Pure Javascript");
});

function copyUsingPureJS(element_id) {
  element_id.setAttribute("contentEditable", true);
  element_id.setAttribute("onfocus", "document.execCommand('selectAll',false,null)");
  element_id.focus();
  document.execCommand("copy");
  element_id.removeAttribute("contentEditable");
  
}

//Jquery:
$(document).ready(function() {
  $("#copyUsingJquery").click(function() {
    copyUsingJquery("#copyTarget");
  });
 

  function copyUsingJquery(element_id) {
    $(element_id).attr("contenteditable", true)
      .select()
      .on("focus", function() {
        document.execCommand('selectAll', false, null)
      })
      .focus()
    document.execCommand("Copy");
    $(element_id).removeAttr("contenteditable");
     alert("Text Copied to Clipboard Using jQuery");
  }
});

#copyTarget {
  width: 400px;
  height: 400px;
  border: 1px groove gray;
  color: navy;
  text-align: center;
  box-shadow: 0 4px 8px 0 gray;
}

#copyTarget h1 {
  color: blue;
}

#copyTarget h2 {
  color: red;
}

#copyTarget h3 {
  color: green;
}

#copyTarget h4 {
  color: cyan;
}

#copyTarget h5 {
  color: brown;
}

#copyTarget h6 {
  color: teal;
}

#pasteTarget {
  width: 400px;
  height: 400px;
  border: 1px inset skyblue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="copyTarget">
  <h1>Heading 1</h1>
  <h2>Heading 2</h2>
  <h3>Heading 3</h3>
  <h4>Heading 4</h4>
  <h5>Heading 5</h5>
  <h6>Heading 6</h6>
  <strong>Preserve <em>formatting</em></strong>
  <br/>
</div>

<button id="copyUsingPureJS">Copy Using Pure JavaScript</button>
<button id="copyUsingJquery">Copy Using jQuery</button>
<br><br> Paste Here to See Result
<div id="pasteTarget" contenteditable="true"></div>

Ambos funcionarão como um encanto:),

JAVASCRIPT:

function CopyToClipboard(containerid) {
if (document.selection) { 
    var range = document.body.createTextRange();
    range.moveToElementText(document.getElementById(containerid));
    range.select().createTextRange();
    document.execCommand("copy"); 

} else if (window.getSelection) {
    var range = document.createRange();
     range.selectNode(document.getElementById(containerid));
     window.getSelection().addRange(range);
     document.execCommand("copy");
     alert("text copied") 
}}

Também em html,

<button id="button1" onclick="CopyToClipboard('div1')">Click to copy</button>

<div id="div1" >Text To Copy </div>

<textarea placeholder="Press ctrl+v to Paste the copied text" rows="5" cols="20"></textarea>

JQUERY: https://paulund.co.uk/jquery-copy-clipboard

A Biblioteca da área de transferência-polifill é uma polifill para a API da área de transferência assíncrona baseada em promessas.

Instalar em CLI:

npm install clipboard-polyfill 

Importar como área de transferência no ficheiro JS

window.clipboard = require('clipboard-polyfill');

Exemplo

Deve ser despoletado pelo clique do utilizador.

$("<textarea/>").appendTo("body").val(text).select().each(function () {
            document.execCommand('copy');
        }).remove();

Ambos funcionarão como um encanto:),

1. JAVASCRIPT:

   function CopyToClipboard(containerid) {
   if (document.selection) { 
       var range = document.body.createTextRange();
       range.moveToElementText(document.getElementById(containerid));
       range.select().createTextRange();
       document.execCommand("copy"); 
   
   } else if (window.getSelection) {
       var range = document.createRange();
        range.selectNode(document.getElementById(containerid));
        window.getSelection().addRange(range);
        document.execCommand("copy");
        alert("text copied") 
   }}
   

Também em html,

<button id="button1" onclick="CopyToClipboard('div1')">Click to copy</button>

<div id="div1" >Text To Copy </div>

<textarea placeholder="Press ctrl+v to Paste the copied text" rows="5" cols="20"></textarea>

1. JQUERY:

Https://paulund.co.uk/jquery-copy-clipboard