Copiar conteúdo ao clicar em texto específico
Página 1 de 1 • Compartilhe
Copiar conteúdo ao clicar em texto específico
Esses dias estava com um pouco de tempo e vi uma necessidade específica para o meu fórum, porém que pode ajudar outros administradores em seus fóruns e decidi compartilhá-la. Em meu fórum existe uma lista que o membro pode copiá-la, mas isto ocupava muito espaço de caracteres no tópico, pois eu deixava o código BBCode dentro da tag code para rápido acesso do membro. Então decidi criar um script que o conteúdo seria copiado ao clicar no nome em destaque na lista. Observe o HTML abaixo.
Observe que existe uma lista e o objetivo é copiar todo o conteúdo dentro do li específico. A solução segue abaixo, mas antes é necessário um input ou um textarea para poder copiar o conteúdo. Então o primeiro passo é colocar o código abaixo na área que deseja que este efeito funcione.
Posteriormente utilize o código abaixo para ao clicar no span todo o li específico será copiado para a sua área de transferência. Deixo um link no JSFiddle para ver o funcionamento.
Link: https://jsfiddle.net/Kadanda/9qka16cw/5/
Não sei se a forma mais eficiente, mas depois de muita pesquisa foi assim que consegui o efeito desejado.
- Código:
<ul><li><span>Clique para copiar</span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem quam aperiam obcaecati, atque, ipsa ut, repellendus minima rem facilis doloremque numquam alias autem aspernatur excepturi. Doloremque quibusdam dolorem hic saepe!</li><li><span>Clique para copiar 2</span>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem quam aperiam obcaecati, atque, ipsa ut, repellendus minima rem facilis doloremque numquam alias autem aspernatur excepturi. Doloremque quibusdam dolorem hic saepe!</li><ul>
Observe que existe uma lista e o objetivo é copiar todo o conteúdo dentro do li específico. A solução segue abaixo, mas antes é necessário um input ou um textarea para poder copiar o conteúdo. Então o primeiro passo é colocar o código abaixo na área que deseja que este efeito funcione.
- Código:
<textarea id="seuTxt" value="Olá mundo!" style="height: 0px;width: 0px;opacity: 0;position: absolute;"></textarea>
Posteriormente utilize o código abaixo para ao clicar no span todo o li específico será copiado para a sua área de transferência. Deixo um link no JSFiddle para ver o funcionamento.
Link: https://jsfiddle.net/Kadanda/9qka16cw/5/
- Código:
/***
* Copiar ao clicar
* By Don Corleone(FdF);
*/
$(document).ready(function() {
$("ul li span:first-child").click(function(){
var t = this.closest("li");
var tt = t.innerHTML;
var ttt = tt.trim();
console.log(ttt);
$("#seuTxt").val('<li>'+ttt+'</li>');
var x = $('#seuTxt').select();
try {
var ok = document.execCommand('copy');
if (ok) { alert('Copiado para a sua área de transferência.'); }
} catch (e) {
alert(e)
}
});
});
Não sei se a forma mais eficiente, mas depois de muita pesquisa foi assim que consegui o efeito desejado.
Tópicos semelhantes
» Copiar conteúdo
» Como copiar o conteúdo de uma categoria
» Copiar conteúdo de outros fóruns
» Restringir conteúdo de um fórum especifico
» Exibir conteúdo para grupo específico
» Como copiar o conteúdo de uma categoria
» Copiar conteúdo de outros fóruns
» Restringir conteúdo de um fórum especifico
» Exibir conteúdo para grupo específico
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos