1

Eu estou colocando um script para copiar o link para área de transferência, usando o plugin ZeroClipboard. O problema é que eu tenho uma lista com vários links que vem do MySQL. E no loop da lista vem sempre a id "copy-link" no <a>. Quando eu clico no segundo link ou nos próximos, então ele não copia para a área de transferência, ele só está copiando o primeiro. Creio que o problema seja a ID por ser a mesma.

javascript

<script type="text/javascript">
            // main.js
            var client = new ZeroClipboard( document.getElementById("copy-link") );

            client.on( "ready", function( readyEvent ) {
              // alert( "ZeroClipboard SWF is ready!" );

              client.on( "aftercopy", function( event ) {
                // `this` === `client`
                // `event.target` === the element that was clicked
                alert('Link copiado!');
              } );
            } );
        </script>

html

<a href="javascript:void(0);" id="copy-link" data-clipboard-text="AQUI VAI O LINK">Copiar Link</a>
0

2 Respostas 2

1

Se tens várias âncoras todas com a mesma ID então document.getElementById("copy-link") só vai retornar um elemento e nõ vai funcionar nos outros...

A maneira correta é trocar esses ID por class. Mas fazendo isso ou não podes ainda ir buscar esses elementos via atributo data-clipboard-text.

De qualquer maneira como são mais que um precisas de um ciclo for para correr o plugin em cada elementto. Sugestão:

var links = document.querySelectorAll('a[data-clipboard-text]');
[].forEach.call(links, function (el) {
    var client = new ZeroClipboard(el);
    client.on("ready", function (readyEvent) {
        // alert( "ZeroClipboard SWF is ready!" );

        client.on("aftercopy", function (event) {
            // `this` === `client`
            // `event.target` === the element that was clicked
            alert('Link copiado!');
        });
    });
});
0

Experimenta utilizar o click event em vez do ready, assim esta acção é accionada cada vez que ocorre um click num link.

<script type="text/javascript">
    // main.js
    var client = new ZeroClipboard( document.getElementById("copy-link") );

    client.on( "click", function() {
    // alert( "ZeroClipboard SWF is ready!" );

        client.on( "aftercopy", function( event ) {
            // `this` === `client`
            // `event.target` === the element that was clicked
            alert('Link copiado!');
        } );
    } );
</script>
1
  • Não resolveu, só copia o primeiro link. Commented 19/06/2015 às 13:15

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 .