1

Bom dia, entendo muito pouco de javascript porém gostaria de criar um script para o tampermonkey onde cada palavra que eu clique dentro do elemento desejado seja copiada, por exemplo

<html>
<head>
    <title>Página Teste</title>
    <meta charset="utf-8">
</head>
<body>
    <p id="copiar">Aqui vai o texto que eu quero copiar</p>
</body>
</html>

Caso eu clique em qualquer palavra desse elemento ela seria copiada, clicar na palavra "texto" vai automaticamente dar um ctrl+c nela

Usando o DevTools do chrome eu fiz o seguinte para testar ( entendo que o código abaixo não tem muito a ver com o que preciso, mas como não entendo muito da linguagem foi assim que eu fui fazendo para testar os resultados que eu preciso )

    let copiar = document.getElementById('copiar');
    let words = copiar.textContent.split(" ");
    function myFunction(item) {
        let txt = document.createElement("h2");
        txt.innerHTML = item
        $("body").append(txt);

    words.forEach(myFunction);

Funciona certinho a parte de pegar o texto completo do id='copiar' e separar cada palavra e armazena-las individualmente num array ( talvez não seja necessário armazenar ), porém não faço ideia de como fazer uma função de "onclick" para cada palavra que quando eu clicar nela automaticamente copie para o clipboard assim precisando dar apenas ctrl+v. Alguém pode me ajudar por favor?

Obrigado!

1 Resposta 1

0

Acredito que isso vá te ajudar:

JS:

selecionarPalavra = () => {
    let selection = window.getSelection();
    let range = selection.getRangeAt(0);
    let node = selection.anchorNode;

    while (range.toString().indexOf(' ') !== 0) {                 
        range.setStart(node,(range.startOffset -1));
    }
        
    range.setStart(node, range.startOffset +1);
    
    do {
        range.setEnd(node, range.endOffset + 1);

    } while (range.toString().indexOf(' ') === -1 && range.toString().trim() !== '');

    let str = range.toString().trim();
    alert(str);
};

HTML:

<html>
<head>
    <title>Página Teste</title>
    <meta charset="utf-8">
</head>
<body>
    <p  onClick="selecionarPalavra()">
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris rutrum ante nunc. Proin sit amet sem purus. Aliquam malesuada egestas metus, vel ornare purus sollicitudin at. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer porta turpis ut mi pharetra rhoncus. Ut accumsan, leo quis hendrerit luctus, purus nunc suscipit libero, sit amet lacinia turpis neque gravida sapien. Nulla facilisis neque sit amet lacus ornare consectetur non ac massa. In purus quam, imperdiet eget tempor eu, consectetur eget turpis. Curabitur mauris neque, venenatis a sollicitudin consectetur, hendrerit in arcu.
</p>
</body>
</html>

Segue o CodePen: https://codepen.io/WegisSilveira/pen/YzwGVWj?editors=1010

Aqui estou simplesmente pegando as palavras e as imprimindo em um alert, mas após copiá-las você pode trabalhá-las como desejar.

1
  • Obrigado pela resposta, fuçando ontem eu consegui algum progresso usando a seguinte função jsfiddle.net/p89jm1yb, funcionou mais ou menos da forma que eu quero, tirando o fato que eu tenho que dar duplo clique para que seja feita a cópia da palavra, porém quando tentei passar para o tampermonkey ele não funcionou na página que eu preciso usar. Gist com o código usado no tampemonkey gist.github.com/edufgimenez/ffa9ed45185c34655b68dc427e339e6b , não entendo muito de java mas vou dar uma olhada no seu código e ver o que consigo entender dele. Obrigado 16/06/2020 às 12:45

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .