Navegue bastante por la red sin finalmente encontrar el script que me sirva para copiar al portapapeles un texto mediante un botón, en un articulo anterior escribí sobre esto, en sus tiempos si funcionaba pero ahora con los cambios que hubo en Flash ya no cumple con el objetivo, es por eso que entrando a la pagina de bit.ly vi que lo podían hacer, y en casi todos los navegadores, me baje los scripts y los filtre hasta lograr obtener las funciones que hacían la funcionalidad de copiar al portapapeles.
Para empezar a implementarlo primero tienen que bajarse el Javascript y el botón Flash.
Paso 1: Incluir e inicializar el Script
Aquí incluiremos el script que nos bajamos y luego agregaremos esta función para customizar más la librería.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="js/ccb.js" type="text/javascript"></script>
<script type="text/javascript">
function addIndexCopyButton(){
var b={
pathToSwf:"ccb.swf?v=3.0",
imageUrl:"button.jpg",
height:"26",
textValue:"Copiar",
width:"46"
};
$("#index_copy_button").html("");
CopyClipboardButton.appendButton("index_copy_button","short_url",b);
}
addLoadEvent(function(){
addIndexCopyButton();
});
</script>
Esta función es para personalizar nuestro botón: setearles el directorio del swf e imagen, cambiar el alto y ancho, configurar el texto (para IE)
Paso 2: Estructura HTML
Creamos un textbox para poder probar si copia o no lo que ingresamos, un elemento <span> donde se insertara por Javascript el Flash que realizara la función de copiar al portapapeles.
<form action="" method="get">
<input name="short_url" id="short_url" type="text"/>
<span id="index_copy_button"></span>
</form>

Comentarios