
Como copiar um conteúdo para Clipboard utilizando apenas Javascript
A abordagem a seguir funciona no Chrome, Firefox, Internet Explorer e Edge e em versões recentes do Safari (o suporte de cópia foi adicionado na versão 10, lançada em outubro de 2016).
Crie uma área de texto e defina seu conteúdo para o texto que você deseja copiar para a área de transferência.
Anexe a área de texto ao DOM.
Selecione o texto na área de texto.
Chame document.execCommand(“copy”)
Remova a área de texto do dom.
Nota: você não verá a área de texto, pois ela é adicionada e removida na mesma invocação síncrona do código Javascript.
Algumas coisas a serem observadas se você estiver implementando isso sozinho:
Por motivos de segurança, isso só pode ser chamado de um manipulador de eventos, como click (assim como com a abertura de janelas).
O Internet Explorer mostrará uma caixa de diálogo de permissão na primeira vez que a área de transferência for atualizada.
O Internet Explorer e o Edge rolarão quando a área de texto estiver focada.
execCommand() pode lançar em alguns casos.
Novas linhas e guias podem ser engolidas, a menos que você use uma área de texto. (A maioria dos artigos parece recomendar o uso de um div)
A área de texto ficará visível enquanto a caixa de diálogo do Internet Explorer for exibida, você precisa ocultá-la ou usar a API de dados da área de transferência específica do Internet Explorer.
No Internet Explorer, os administradores de sistema podem desabilitar a API da área de transferência.
A função abaixo deve lidar com todos os problemas a seguir da maneira mais limpa possível. Por favor, deixe um comentário se você encontrar algum problema ou tiver alguma sugestão para melhorá-lo.
function copyToClipboard(text) {
if (window.clipboardData && window.clipboardData.setData) {
// Internet Explorer-specific code path to prevent textarea being shown while dialog is visible.
return window.clipboardData.setData("Text", text);
}
else if (document.queryCommandSupported && document.queryCommandSupported("copy")) {
var textarea = document.createElement("textarea");
textarea.textContent = text;
textarea.style.position = "fixed"; // Prevent scrolling to bottom of page in Microsoft Edge.
document.body.appendChild(textarea);
textarea.select();
try {
return document.execCommand("copy"); // Security exception may be thrown by some browsers.
}
catch (ex) {
console.warn("Copy to clipboard failed.", ex);
return prompt("Copy to clipboard: Ctrl+C, Enter", text);
}
finally {
document.body.removeChild(textarea);
}
}
} Seu banner de consentimento está certo, mas o vídeo incorporado grava cookie de terceiro no primeiro carregamento. Troque o domínio…
A listagem do custom post type abre e o single dá 404 no WordPress 6.9. Entenda o cache das rewrite…
Um par .service e .timer substitui a linha do crontab com log no journal, execução perdida recuperada no boot e…
400 produtos importados do fornecedor com a aba Descrição vazia. Um wp eval-file percorre os SKUs sem texto, grava pelo…
Some com PAC e SEDEX da lista quando o frete grátis está disponível, usando woocommerce_package_rates, e limpe o cache de…
A barra de upload chega no fim e o WordPress devolve só "Erro HTTP". Separe as três causas: Imagick barrado…