javascript - saber - ¿Detecta el foco iniciado por la tecla de tabulación?

saber que elemento tiene el foco jquery

Question

Quiero detectar el evento de enfoque de un elemento, pero solo si fue iniciado por el usuario presionando la tecla de tabulación. Por ejemplo:

<input type="text" id="foo" />
<input type="text" id="detect" />

Si el usuario está enfocado en #foo y presiona Tab , quiero que el evento se #detect una vez que #detect se enfoque (o que un condicional dentro del evento de enfoque sea verdadero). Por el contrario, si el usuario simplemente hace clic en el campo #detect para enfocarlo, no quiero que el evento se dispare (o quiero que el condicional dentro de la llamada al evento de enfoque sea falso).

No quiero utilizar el evento de #foo de #foo y verificar si se presionó la tecla de tabulación, ya que quiero que el enfoque sea independiente de cualquier otro elemento.

Miré a través de la salida de la consola del siguiente código, pero no pude notar ninguna diferencia real entre los dos métodos de enfoque:

$(''#detect'').on(''focus'', function(e){
   console.log(e); 
});

( violín )

¿Es esto posible de lograr de una manera relativamente simple?

Answer 1

Como habrás notado, el objeto del evento en sí mismo no distingue los medios de acceso. Lo que puede hacer es enlazar un oyente mousedown , que se disparará antes de focus , y establecer un indicador de marca de tiempo que compare con algún valor de umbral en su controlador de focus .

Answer 2

Puede verificar el evento de enfoque en entradas específicas por este código

$(window).on(''keyup'', function(event){
    if(event.keyCode == ''9''){

      getFocused(event);
    }

})
var focused = 0;
function getFocused(e){
var ida =  $('':focus'').eq(0).prop(''id'');
    if(ida==''detect'' && focused==0){
        focused = 1;
        console.log(e);
    }
}

(violín)

Answer 3

Sé que has aceptado una respuesta pero puedes probar el botón presionado usando lo siguiente:

$(''#detect'').on(''focus'', function(e){
    $(window).keyup(function (e) {
        var code = (e.keyCode ? e.keyCode : e.which);
        if (code == 9) {
           alert(''I was tabbed!'');
        }
    });
});

http://jsfiddle.net/LPGLm/1/

Editar: cambiar el oyente a su alrededor:

$(window).keyup(function (e) {
    var code = (e.keyCode ? e.keyCode : e.which);
    if (code == 9 && $(''#detect:focus'').length) {
        alert(''I was tabbed!'');
    }
});

http://jsfiddle.net/LPGLm/7/

Answer 4

Una solución más receptiva sería usar dos oyentes:

var mousedown = false;
$(''#detect'').on(''mousedown'', function () {
    mousedown = true;
});

$(''#detect'').on(''focusin'', function () {
    if(!mousedown) {
        // logic
    }
    mousedown = false;
});

Violín que muestra la diferencia de velocidad:

http://jsfiddle.net/u2y45/1/

Answer 5

<input type="text" id="foo" />
<input type="text" id="detect" />
<script>
 $("#foo").on(''keyup'', function(){    
   document.getElementById("detect").value = "007";  
    alert("your tab active successfully");  
   });  
 </script>