Copiar dirección de la página al portapapeles

coke_135 · #1 (**permalink**) 17/03/2004, 05:51

No se si podrá hacer. he visto por ahí scripts que permiten seleccionar un determinado texto y a la vez copiarlo al portapapeles. Me gustaría conseguir un scripts mediante el cual, el texto a seleccionar y copiar sería la dirección de esa determinada página. Es decir, copiar la dirección al portapapeles mediante un enlace. No se si me he explicado bien... :)

¡Gracias!

rsalvadores · #2 (**permalink**) 18/03/2004, 03:49

Esta es una forma un poco chapuza, imagino que las hay más elegantes.

<html>
<head>
<title>URL Portapapeles</title>
<script language="JavaScript">
function URLportapapeles(){
document.getElementById("hidURL").value=document.U RL
var _varURL=document.getElementById("hidURL")
document.getElementById("LyURLHid").style.visibili ty="visible"
_varURL.focus();
_varURL.select();
document.getElementById("LyURLHid").style.visibili ty="hidden"
if (document.all) {
rango = _varURL.createTextRange();
rango.execCommand("Copy");
alert ("Copiado en el portapapeles la URL:\n"+document.getElementById("hidURL").value)
}
}
</script>

<body bgcolor="#FFFFFF" text="#000000">
<div id="LyURLHid" style="visibility: hidden">
<form name="formCoor">
<input type="text" name="hidURL" id="hidURL" value="">
</form>
</div>
<p><a href="javascript:URLportapapeles()">Copiar URL</a> </p>
</body>
</html>

Suerte

rsalvadores

coke_135 · #3 (**permalink**) 18/03/2004, 06:31

Muchísimas gracias. El caso es que funcione ;)

Salu2

coke_135 · #4 (**permalink**) 23/03/2004, 10:41

Cuando lo probé la primera vez funcionó muy bien, y ahora también :), pero tengo un pequeño problema.

El código que me pasaste genera un cuadro de texto (invisible) que hace que todo se me desplace hacia abajo una linea. Algo así:

Original:

Link - Link - Link - Link

Con el Javascript:

(Cuadro invisible)

Link - Link - Link - Link

¿Habría alguna forma de solucionarlo?

Gracias de nuevo. Salu2

JavierB · #5 (**permalink**) 23/03/2004, 10:51

Hola, coke_135.

Cambia: style="visibility:hidden"

por: style="display:none"

Saludos,

coke_135 · #6 (**permalink**) 23/03/2004, 11:36

Hola Javier:

Gracias por ayudarme, pero parece que no funciona. Si te refieres a este hidden:

Código PHP:

   <div id="LyURLHid" style="visibility: hidden">

cambiándolo me da error.

Si te refieres a este otro:

Código PHP:

   document.getElementById("LyURLHid").style.visibility="hidden"

me sale como yo quiero, pero solo al hacer click en el enlace, antes de hacerlo sale igual que antes, desplazado hacia abajo.

A ver si lo arreglamos. ¡Gracias!

JavierB · #7 (**permalink**) 23/03/2004, 12:26

Hola de nuevo.

Veamos si ahora marcha:

<div id="LyURLHid" style="visibility: hidden; height:0px">

Saludos,

coke_135 · #8 (**permalink**) 23/03/2004, 14:59

Gracias otra vez Javier. Siento ser pesado, pero sigue sin funcionar. Ocurre lo mismo que antes, al hacer click desaparece el recuadro, pero antes de hacerlo se queda arriba el espacio en blanco del cuadro.

Un saludo

rsalvadores · #9 (**permalink**) 24/03/2004, 03:28

No se si entiendo muy bien el problema.
El espacio que te queda arriba es por el div, si lo quieres quitar tienes dos opciones, cambia el orden del href y el div:

...
<body bgcolor="#FFFFFF" text="#000000">
<p><a href="javascript:URLportapapeles()">Copiar URL</a> </p>
<div id="LyURLHid" style="visibility: hidden">
<form name="formCoor">
<input type="text" name="hidURL" id="hidURL" value="">
</form>
</div>

</body>

o colocar el div en una posicion absoluta:

...
<body bgcolor="#FFFFFF" text="#000000">
<div id="LyURLHid" style="position:absolute; left:0px; top:0px; width:0px; height:0px; z-index:1;visibility: hidden">
<form name="formCoor">
<input type="text" name="hidURL" id="hidURL" value="">
</form>
</div>
<p><a href="javascript:URLportapapeles()">Copiar URL</a> </p>
</body>

De todas formas, como dice JavierB, creo que es más adecuado poner:

style="display:none"

en vez de:

style="visibility:hidden"

No se muy bien porque, lo lei en otro asunto, pero ya no me acuerdo.

Espero que se haya solucionado tu problema.

Saludos

rsalvadores

rsalvadores · #10 (**permalink**) 24/03/2004, 03:53

Ya se porque es mejor usar "display" en vez de "visibility".

La solución de JavierB era buena, pero creo que no la has entendido correctamente, hay que cambiar la propiedad

"visisbility" por "display",

y sustituir "visible" por "block" y "hidden" por "none"

pero en toda la página.

<html>
...
document.getElementById("LyURLHid").style.display= "block";
...
...
document.getElementById("LyURLHid").style.display= "none";
...
...
<div id="LyURLHid" style="display:none">
...
...
</html>

Suerte.

rsalvadores

coke_135 · #11 (**permalink**) 24/03/2004, 11:47

¡Ahora si! Parece que funciona ;). Muchísimas gracias.

Ahora una duda, una curiosidad mas que nada :) para saber el funcionamiento del script. ¿Es estrictamente necesario añadir el cuadro de texto (aunque sea invisible)?. Si no me equivoco (que es muy probable xD), la url del documento es la variable .document.URL. ¿No se podría copiar al portapapeles directamente?

Gracias por todo. Un saludo

rsalvadores · #12 (**permalink**) 25/03/2004, 04:46

Yo creo que no, ya que primero necesita seleccionar el texto.

Tambien hay otra forma utilizando el id del elemento, pero creo que te pasaría lo mismo.

De todas formas, yo no soy muy entendido en esto, probablemente los moderadores puedan ayudarte más.

Haz una busqueda por "portapapeles" creo que encontrarás más cosas.

Suerte.

rsalvadores