Criando botão de copiar com JS
Criando funcionalidade de copiar com JavaScript
É bastante comum precisarmos copiar algo na tela, seja para pesquisar posteriormente ou somente para guardar em algum lugar, e com isso, vamos criar uma função rápida para copiar texto com JavaScript.
Código
Primeiro vamos criar a interface, faremos algo simples, utilizando apenas HTML.
Na estrutura em HTML foi criado um input que será o texto a ser copiado, e temos dois botões, que será usado para demonstrar duas formas de copiar texto com JavaScript.
No primeiro tipo adicionamos um evento ao botão com id execCopy que chama uma função de mesmo nome, nesta função primeiro selecionamos o texto, e posteriormente usamos a função execCommand("copy"); essa é uma função nativa que executa o comando de copia.
No segundo tipo adicionamos um evento ao botão com id clipboardCopy que chama uma função de mesmo nome, nesta função primeiro recuperamos o valor do input e depois passamos para a função de clipboard , um detalhe nesta função é que para funcionar corretamente é necessário usar o async e o await, ou usar o then() , pois ele é uma promisse.
pronto simples assim.
Demo
Veja abaixo o projeto completo funcionando.
Youtube
Se preferi assistir, vejo o desenvolvimento no youtube.
Obrigado por ler!
Se você tiver alguma dúvida, reclamação ou dica, pode deixar aqui nos comentários. Vou ter o maior prazer em responder!
😊😊 Até mais! 😊😊
