Copiando texto para área de transferência em JavaScript

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

[ Hits: 9.163 ]

Blog: https://fabio.automatizando.dev

 


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

Instalando plugin FastTrack no GiFT (Debian)

Cmatrix - screensaver do filme no seu terminal

Como suprimir a emissão de luz azul da tela via linha de comando

Como somar todos os números contidos num arquivo texto

Lançamento do TupiServer Linux 1.0

Leitura recomendada

HTML com Broffice.org

Atualizando conteúdo dinamicamente com jQuery

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

Bloqueando objetos Flash de páginas

Ativando Player HTML5 no YouTube

  

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