Te lo explico encantado!
cuando presionas el botón se ejecuta este código: Código PHP:
<script>
function escribir(){
posibleSaludo=document.forms[0].insultos;
document.forms[0].carta.focus();
document.forms[0].carta.value+=posibleSaludo.options[posibleSaludo.selectedIndex].text+"\n\n";
}
</script>
Que lo que hace es:
mete en la variable posibleSaludo el menú desplegable (o select). Esto lo hago para que no queden lineas demasiado largas.
¿Cómo lo hago?
Javascript hace un array con todos los formularios de una página (y con todas las imágenes y con todos los links...) y los mete en la variable forms. Para referirnos a este formulario ponemos forms[0], es decir, estamos pidiendo que vaya al primer formulario de la página (recuerda que javascript empieza a contar desde el cero). Luego dentro del formulario pedimos que busque el elemento cuyo nombre (name) sea insultos.
Con esto hemos hecho que cada vez que se ponga posibleInsulto sea como si pusieramos document.forms[0].insultos;
Hasta ahora fácil, no?
Luego ponemos el foco en el textbox llamado carta. Esto lo hacemos para que cuando introduzca el saludo seleccionado en el text box quede el cursor después del saludo y no antes.
Esto también es sencillo, no me digas que no!
Ahora viene lo que tal vez sea un poquito más complicado. Código PHP:
document.forms[0].carta.value+=posibleSaludo.options[posibleSaludo.selectedIndex].text+"\n\n";
Aquí decimos que al valor del elemento carta (el textbox) del primer formulario del documento se le añada (a+=b es lo mismo que decir a=a+b) el texto que se muestra de la opción seleccionada del combo (select).
Cómo se descubre la opción seleccionada del select
Javascript hace un array (este JS se pasa el día haciendo arrays) con todos las opciones (<option>) de un select. Las mete en la variable options. Así que si ponemos:
Código PHP:
alert(document.forms[0].insultos.options[3].text);
nos saldrá un alert con el texto "Atolondrado Narizotas:" (recuerda que JS empieza a contar desde el cero).
si hubiesemos puesto: Código PHP:
alert(document.forms[0].insultos.options[3].value);
nos abría dado 4 que es el value del elemento 3 (empezando a contar desde cero, claro).
entonces, como podemos poner entre los corchetes el valor del elemento que se ha seleccionado?
Aquí js nos lo pone un poco dificil, porque para saber que elemento del array options ha sido seleccionado tenemos que poner:
Código PHP:
document.forms[0].insultos.selectedInsex;
poniendo esto nos daría un número que es el número que hace en el array el elemneto seleccionado.
Así, si seleccionamos "Pedazo de Imbecil" nos daría un 0 (cero) porque es la primera opción.
Pero esto a veces es muy poco útil... ya que lo que queremos saber es el value o el text de al lado... entonces ¿cómo lo hacemos?
Pues podemos combinar las dos caracteristicas dichas:
Metemos en una variable el elemento elegido:
Código PHP:
elegido=document.forms[0].insultos.selectedInsex;
y ahora pedimos que nos muestre el texto o el valor de ese elemento:
Código PHP:
textoElegido=document.forms[0].insultos.options[elegido].text;
valorElegido=document.forms[0].insultos.options[elegido].value;
Ahora entenderás perfectametne (espero) la última línea del código:
Código PHP:
document.forms[0].carta.value+=posibleSaludo.options[posibleSaludo.selectedIndex].text+"\n\n";
Se añade al valor de la carta el texto de al lado de la opción seleccionado. Es decir el texto en rojo de aquí abajo:
<option value="3">Suerte de Bobalicón:</option>
Confío en haberme sabido explicar. Si tienes más dudas por mi torpeza al explicar por favor hazmelo saber.
Un saludo!!