Neste artigo vou ensinar a copiar um texto para a área de transferência (clipboard) usando javascript com o Zero Clipboard. Assim sendo, é possivel copiar o texto da sua página e depois colar em outro programa.
Aviso: No Internet Explorer esse script só funcionará na versão 9 pra cima. Você pode tentar catar a versão 2.0.2 do Zero Clipboard na internet, mas a maneira de utilizar é diferente da explicada aqui.
Primeiro baixe o Zero Clipboard clicando aqui.
Vai ter um monte de coisa no zip mas o que nos interessa é o que está na past dist do zip. Copie ZeroClipboard.min.js e ZeroClipboard.swf para a pasta javascript da sua página.
O nosso código vai ficar assim:
<!DOCTYPE html> <html lang="pt-br"> <head> <title>Teste Zero Clipboard</title> <meta charset="utf-8"> <script src="js/ZeroClipboard.min.js"></script> </head> <body> <div id="texto">Este texto será copiado para o clipboard</div> <button id="botao-copiar" data-clipboard-target="texto">Copiar</button> </body> </html>
Criamos um div com o id texto e colocamos a frase que será copiada dentro dele.
Fizemos também um botão com o id botao-copiar e o atributo data-clipboard-target apontando para o id texto do div. Isso diz para o script que ele deverá copiar o texto do div quando o botão for clicado.
Agora vamos criar uma tag script no finalzinho da nossa tag body, ainda dentro dela.
<script> var client = new ZeroClipboard(); client.clip(document.getElementById("botao-copiar")); client.on("aftercopy", function(){ alert("Copiado!"); }); </script>
Primeiro criamos um objeto ZeroClipboard e atribuímos ele à variável client.
Depois usamos o método clip pra colocar o swf em cima do botão, para que quando clicado ele chame uma função do flash pra copiar o texto.
Por último colocamos uma escuta para o evento aftercopy, ou seja, quando a cópia for feita a função passada será executada. A função simplesmente exibe um alerta dizendo que o texto foi copiado.
Não esqueça de comentar, dúvidas e sugestões são bem-vindas!