2009-12-11 36 views
8

Pregunta rápida: ¿es posible detectar si un foco proviene de un clic del mouse o una pestaña de un evento de enfoque?¿Puedo detectar la fuente de un foco? (Javascript, jQuery)

Supongo que si no es así, tendré que usar un control de clic en el mismo elemento para determinar la fuente, pero preferiría un camino desde el evento de enfoque.

Gracias

Gausie

+0

+1 porque es una pregunta interesante. pero no entiendo por qué necesitas esa distinción. –

+0

Estoy haciendo un formulario de entrada de datos para la entrada rápida. Si las pestañas del usuario en el cuadro, quiero desplazarme para que el elemento se centra verticalmente en la pantalla. Pero si hacen clic, el efecto se vuelve muy desorientador y no quiero que ocurra. – Gausie

Respuesta

4

puede no funcionar al 100% pero si no hay una manera directa y después no puedes usar Mouseover y detectarlo? La persona tendrá que llevar el mouse sobre el control para seleccionarlo (?)

+2

También puede tabular el control ... – Mickel

+1

Sí verdadero si los datos se ingresan en un control y si el mouse no se ha pasado antes de ingresar los datos puede usarse con "tab" :) – Shoban

+0

THanks - esto fue una buena idea. Aquí está el código utilicé \t \t \t \t $ ('input'). Mouseover (function() { \t \t \t \t \t $ (this).attr ('clic', 'verdadero'); \t \t \t \t}); \t \t \t \t $ ('input') mouseout (function() { \t \t \t \t \t $ (this) .removeAttr ('clic'); \t \t \t \t}). \t \t \t \t $ ('entrada') se centran (function() { \t \t \t \t \t $ este = $ (this);. \t \t \t \t \t $ this.parents ('tr'). Css ('color de fondo', 'amarillo'); \t \t \t \t \t si { \t \t \t \t \t \t alerta (1) ($ this.attr ('clic') = 'verdadero'!); . \t \t \t \t \t \t $ ('cuerpo') scrollTop (. $ This.offset() superior - ($ (ventana) .height()/2)); \t \t \t \t \t} \t \t \t \t}); \t \t \t \t $ ('input') Blur (function() { \t \t \t \t \t $ (this) .parents ('tr') css ('background-color', 'transparente');.. \t \t \t \t}); – Gausie

0

Estoy bastante seguro de que un evento de enfoque no marca la forma en que se ordenó el enfoque (ventana.focus, tecla, clic ...)

Pero en el caso de un clic, puede detectar el clic del mouse. También puedes detectar el evento del teclado (más sobre eso http://www.quirksmode.org/js/keys.html).

0

¿Qué hay de usar la posición del mouse?

En el controlador de eventos, compare la posición actual del mouse con el área de su control. Si las coordenadas caen dentro del área del control, no se desplace.

Esta no es una solución perfecta, por supuesto, ya que podrían pasar el elemento por encima y luego tabular sin hacer clic. Pero dado que estás tratando de reducir cualquier desorientación, esto podría ser un buen efecto secundario.

Cuando trabajo con la posición del mouse, me gusta usar el script desde quirksmode.org. Creo que Jquery también puede proporcionarle algunas funcionalidades.

0

Intente obtener el código clave - aquí hay un enlace a un artículo que detalla cómo. Los comentarios en la parte inferior también pueden ser útiles.

http://www.geekpedia.com/tutorial138_Get-key-press-event-using-JavaScript.html

Aquí está el código del artículo. No se muestra, pero el código de tecla para la lengüeta es 9.

<script type="text/javascript"> 

document.onkeyup = KeyCheck;  

function KeyCheck(e) 

{ 

    var KeyID = (window.event) ? event.keyCode : e.keyCode; 


    switch(KeyID) 

    { 

     case 16: 

     document.Form1.KeyName.value = "Shift"; 

     break; 

     case 17: 

     document.Form1.KeyName.value = "Ctrl"; 

     break; 

     case 18: 

     document.Form1.KeyName.value = "Alt"; 

     break; 

     case 19: 

     document.Form1.KeyName.value = "Pause"; 

     break; 

     case 37: 

     document.Form1.KeyName.value = "Arrow Left"; 

     break; 

     case 38: 

     document.Form1.KeyName.value = "Arrow Up"; 

     break; 

     case 39: 

     document.Form1.KeyName.value = "Arrow Right"; 

     break; 

     case 40: 

     document.Form1.KeyName.value = "Arrow Down"; 

     break; 
    } 

} 
</script> 
0

Si alguien está interesado, aquí está cómo lo hice:

$('input').focus(function(){ 
    $this = $(this); 
    $this.parents('tr').css('background-color','yellow'); 
    if($this.attr('click')!='true'){ 
     $('body').scrollTop($this.offset().top-($(window).height()/2)); 
    } 
}).blur(function(){ 
    $(this).parents('tr').css('background-color','transparent'); 
}).mouseover(function(){ 
    $(this).attr('click','true'); 
}).mouseout(function(){ 
    $(this).removeAttr('click'); 
}); 
Cuestiones relacionadas