| Sección
"Java Scripts" |
|
Lección
55 |
Opción
para seleccionar texto (instalar varias cajas en
una misma página)
Como
explicamos en la lección 53, este
Script permite dar la posibilidad a tu usuario que
seleccione a través de un botón, el texto que le
das para cortar y pegar. Solo que en ocasiones
querrás instalar varias cajas como estas en una
misma página, para ello deberemos proceder de la
siguiente manera:
Este
es el código básico de este Script:
<form
NAME="Copy">
<p><input type="button" value="Seleccionar
Todo"
onClick="javascript:this.form.txt.focus();this.form.txt.select();"></p>
</div><div align="left"><p>
<textarea NAME="txt"
ROWS="8" COLS="70"
WRAP="Saludos">Aquí escribes lo que deseas
</textarea> |
|
Lo
que pinté con azul corresponde al texto que
saldrá en el botón, lo puedes modificar a gusto.
Lo
que pinté con rojo es aquello que escribirás
para que salga dentro de la caja de texto.
Pero
para habilitar varias cajas como esta, debemos
utilizar un código como este:
<table border="0" width="100%" cellspacing="6" cellpadding="0">
<tr>
<td width="100%"><font color="#000000" face="MS Sans Serif" size="3">Aquí
escribes el encabezado que desees para la caja 1:</font></td>
</tr>
</table>
<div align="left">
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><form NAME="Copia">
<div align="left"><p><input type="button" value="Seleccionar Todo"
onClick="javascript:this.form.txt.focus();this.form.txt.select();"> </p>
</div><div align="left"><p><textarea NAME="txt" ROWS="6" COLS="65" WRAP="VIRTUAL">Escribir 1
</textarea></p>
</div>
</form>
</td>
</tr>
</table>
</div>
<table border="0" width="100%" cellspacing="4" cellpadding="0">
<tr>
<td width="100%"><font color="#000000" face="MS Sans Serif" size="3">Aquí
escribes el encabezado que desees para la caja 2:</font></td>
</tr>
</table>
<div align="left">
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><form NAME="Copiar">
<div align="left"><p><input type="button" value="Seleccionar Todo"
onClick="javascript:this.form.txt2.focus();this.form.txt2.select();"> </p>
</div><div align="left"><p><textarea NAME="txt2" ROWS="6" COLS="65" WRAP="VIRTUAL">Escribir 2
</textarea></p>
</div>
</form>
</td>
</tr>
</table>
</div>
<table border="0" width="100%" cellspacing="4" cellpadding="0">
<tr>
<td width="100%"><font color="#000000" face="MS Sans Serif" size="3">Aquí
escribes el encabezado que desees para la caja 3:</font></td>
</tr>
</table>
<div align="left">
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><form NAME="Copi">
<div align="left"><p><input type="button" value="Seleccionar Todo"
onClick="javascript:this.form.txt2.focus();this.form.txt2.select();"> </p>
</div><div align="left"><p><textarea NAME="txt2" ROWS="6" COLS="65" WRAP="VIRTUAL">Escribir 3
</textarea></p>
</div>
</form>
</td>
</tr>
</table>
</div> |
Se
nota claramente cada uno de los tres códigos
pertenecientes a cada caja, si deseas más, solo
lo copias nuevamente debajo del último, pero
siempre pon otro nombre a cada formulario. Es
decir, en la etiqueta <form
NAME="Copy">,
donde en este caso "Copy" es el nombre
del formulario, al siguiente le pondrás un nombre
diferente, cosa que no haya dos iguales, pues si
reiteras nombres, eso causaría algunos problemas.
Fíjate que he pintado en el ejemplo, los nombres
de los formularios con verde para que los
distingas.
Para
cortar el código y pegarlo en tu página, debes
ingresar por el botón que coloco a continuación.
Se
abrirá una ventana donde habrá un mensaje que
dice "Ver código Fuente", seleccionas
esa opción y recortas de esa página el código
que mostré aquí arriba. Si tienes uddas, dentro
del código fuente puse las indicaciones,
explicadas también para principiantes.
Recordemos
que este Script también puede ser hallado
en el programa Depósito, el cual puedes
bajar de aquí: webtutorial.com.ar
Buena
suerte.
|
|
