Copiando texto para área de transferência em JavaScript

Publicado por Fábio Berbert de Paula em 19/06/2020

[ Hits: 8.240 ]

Blog: https://www.instagram.com/alexabolada/

 


Copiando texto para área de transferência em JavaScript



Existem duas formas de se copiar texto para a área de transferência usando vanilla JavaScript. Uma delas é usando um objeto do tipo input. Exemplo:

<input value="Este texto será copiado" />
<button>Copiar</button>

<script>
document.querySelector("button").addEventListener("click",
function (event) {
        document.querySelector("input").select()
        document.execCommand('copy')
})
</script>

A outra é usando qualquer elemento do tipo "contentEditable". Exemplo:

<p id="texto" contentEditable>Este texto será copiado.</p>
<button>Copiar</button>

<script>
document.querySelector("button").addEventListener("click",
function (event) {

        document.querySelector("p").focus()
        document.execCommand('selectAll', false, null)
        document.execCommand('copy')
})
</script>

Em navegadores mais modernos já existe uma terceira forma, que é usando a Clipboard API (navigator.clipboard), mas como o código ainda não é compatível com a maioria dos navegadores, vou encerrar a dica somente citando essa hipótese.

Até a próxima!

Outras dicas deste autor

Tag <video> com autoplay não está funcionando? [Resolvido]

Como reproduzir vídeos no Chromecast usando o VLC

Skype Call Recorder - Como gravar áudio de chamadas do Skype

ERROR 144 - Table XXX is marked as crashed and last (automatic?) repair failed [Resolvido]

Como converter vídeos para AVI sem perder qualidade

Leitura recomendada

Sistemas de conteúdo em Webserver de projeto pessoal em ambiente SourceForge

Como corrigir erros de acentuação em códigos HTML, PHP ou JavaScript

Can I use - Checar compatibilidade de comandos HTML5, CSS, JavaScript e outros

Sites e grupos para encontrar emprego de TI

JavaScript - verificar se todos os itens de um array são pares ou ímpares

  

Comentários

Nenhum comentário foi encontrado.



Contribuir com comentário




Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts