Ver Mensaje Individual
  #1 (permalink)  
Antiguo 30/06/2009, 07:33
Avatar de Adler
Adler
Colaborador
 
Fecha de Ingreso: diciembre-2006
Mensajes: 4.671
Antigüedad: 18 años, 2 meses
Puntos: 126
Problema con onblur

Hola

Ayer a raíz de una consulta me acordé que había dejado aparcado un problema que aún no se como solucionar

Se trata de un autocomplete

Ante el evento onkeyup se muestra una capa con las distintas opciones.

Código javascript:
Ver original
  1. window.onload = function () {
  2. var elemText = document.getElementById("txt");
  3.        
  4.     elemText.onkeyup = function() {
  5.         muestraDIV(elemento.value);
  6.         }
  7.  
  8.     elemText.onblur = function () {
  9.         var ref = document.getElementById("contenedor").getElementsByTagName("A");
  10.         for (var i = 0; i < ref.length; i++) {
  11.         ref[i].id.onclick = rellenarCaja(ref[i].id);
  12.         }
  13.         }
  14.  
  15. }

Cuando el evento es onblur, saco todos los elementos que hay en la capa que se ha desplegado y cuando se hace click en uno de ellos, llama a la función rellenarCaja, que rellena el campo de texto.

Código javascript:
Ver original
  1. function rellenarCaja(texto) {    
  2. var elemDiv = document.getElementById("contenedor");
  3.  
  4.     if (texto.length == "") {
  5.          elemDiv.style.display= "none";    
  6.     }
  7.     else
  8.     {
  9.         document.getElementById("txt").value = texto;
  10.                 elemDiv.style.display= "none";    
  11.     }
  12. }

Y aquí el problema, al quitar el foco del campo de texto, siempre me rellena la caja con el último elemento, da igual que haga click en la capa o en cualquier otra parte de la ventana.

Lo que quiero que ocurra.
+ Cuando el text pierda el foco, por que se haya clickeado en una de las opciones, se oculte la capa e imprima en el text la opción seleccionada.
+ Cuando el text pierda el foco, por que se haya clickeado en cualquier parte de la ventana, excepto en la capa, se oculte la capa.

Gracias
__________________
Los formularios se envían/validan con un botón Submit
<input type="submit" value="Enviar" style="background-color:#0B5795; font:bold 10px verdana; color:#FFF;" />