Problema con onblur

[Adler]

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:

window.onload = function () {
var elemText = document.getElementById("txt");
        
    elemText.onkeyup = function() {
        muestraDIV(elemento.value);
        }
 
    elemText.onblur = function () {
        var ref = document.getElementById("contenedor").getElementsByTagName("A");
        for (var i = 0; i < ref.length; i++) {
        ref[i].id.onclick = rellenarCaja(ref[i].id);
        }
        }
 
}
 

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:

function rellenarCaja(texto) {    
var elemDiv = document.getElementById("contenedor");
 
    if (texto.length == "") {
         elemDiv.style.display= "none";    
    }
    else
    {
        document.getElementById("txt").value = texto;
                elemDiv.style.display= "none";    
    }
}
 

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

[elzurdo87]

mira no soy un experto pero visto que nadie te ayuda voy a darte mi punto de vista "logico" y no por ello funcional. tu haces el llamado de la funcion rellenarCaja en cada elemento del for y por ende te esta quedando el ultimo elemento de la lista por que el for recorre hasta el final y es ahi que deja el ultimo .
yo trataria de no utilizar el for de esa forma y buscaria una forma de cortar el for con una segunda condicion para que se corte en el momento que encuentre tu opcion deseada ... espero haber sido lo suficientemente claro
ya que no lo soy muy seguido

[Adler]

Gracias, elzurdor87 pero ........ no es ese el problema. Si se te ocurre algo más ....

[David]

Puedes asignar el evento onclick a window (window.addEventListener o window.attachEvent dependiendo del navegador); así, si se produce ese evento, ocultas la capa. Si se hizo click en la capa, quitar el onclick del window.

[Adler]

Hola

¿Es esto a lo que te referías?

Código javascript:

function Evento(elemento,nomevento,funcion) {
  if (elemento.attachEvent)
  {
      var f=function(){
        funcion.call(elemento,window.event);
    }
    elemento.attachEvent('on'+nomevento,f);
    return true;
  }
  else  
    if (elemento.addEventListener)
    {
      elemento.addEventListener(nomevento,funcion,false);
      return true;
    }
    else
      return false;
}
 
 
 
window.onload = function () {
var elemento = document.getElementById("txt");
var elementoDIV = document.getElementById("contenedor");
    
    elemento.onkeyup = function() {
        muestraDIV(elemento.value);
        }
 
    window.onclick = function () {
        OcultarDiv();
        }
 
}
 
 
 
 
 
 
function RellenarCaja(valor) {  
var obj = captura_objeto("contenedor")
        document.getElementById("txt").value = valor;
                obj.style.display= "none";      
}
 
 
 
 
 
function OcultarDiv() { 
var obj = captura_objeto("contenedor")
                obj.style.display= "none";  
    
}
 

El ResponseText trae javascript

Código javascript:

<script type="tex/javascript">
var ref = document.getElementById('contenedor').getElementsByTagName('a');
for (var i = 0; i < ref.length; i++) {
  Evento(ref[i], 'click', function() {
      RellenarCaja(this.id); 
})    
}
</script>
 

Tal y como esta funciona, pero ... ¿alguna sugerencia. algo que creas que debo modificar,....?

Gracias

[David]

Me alegra que te haya funcionado.

Lo que sí puedes cambiar (aunque igual no tiene mucha relevancia), aprovechar que tienes la función Evento() lo usas también para asignar el onkeyup y onclick de window y elemento.

Saludos.

[Adler]

Hola

onkeyup, sí podría manejarla con la escucha, pero la función ocultaDiv y RellenarCaja se lanzan con onclick. ¿No entrarían en conflicto? Quiero decir que como se sabría a que función se está llamando si ambas se ejecutan con el mismo evento?

Gracias