SummArg | Cursos y recursos para webmasters

26/02/2011

Copiar al portapapeles: Zero Clipboard para jQuery

zClip es un plugin para jQuery que nos ayuda a lograr copiar un texto al portapapeles (clipboard) con presionar un botón. Está programado sobre la base de la librería Zero Clipboard, que usa una película flash invisible que es compatible con Flash Player 10 y anteriores.

El modo de uso es muy sencillo, primero debemos colocar las siguientes llamadas entre etiquetas <head>

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.zclip.js"></script>

En el cuerpo de nuestro documento, antes del cierre de la etiqueta <body>, colocamos:

<script>
$(document).ready(function(){
 $('a#copy-description').zclip({
 path:'js/ZeroClipboard.swf',
 copy:$('p#description').text()
 });
 // El link con ID "copy-description" copiará al portapapeles
 // el texto del párrafo con ID "description"
 $('a#copy-dynamic').zclip({
 path:'js/ZeroClipboard.swf',
 copy:function(){return $('input#dynamic').val();}
 });
 // El link con ID "copy-dynamic" copiará el valor actual del
 // input con ID "dynamic" que cambiará constantemente.
});
</script>

Demo | Descarga

Dejar un comentario