JQuery o JavaScript: ¿Cómo se determina si se presionó la tecla Mayús mientras se hace clic en el hipervínculo de etiqueta de ancla?

Question

Tengo una etiqueta de anclaje que llama a una función de JavaScript.

Con o sin JQuery, ¿cómo puedo determinar si la tecla Shift está presionada mientras se hace clic en el enlace?

El siguiente código NO funciona porque la pulsación de tecla solo se activa si se presiona una "tecla real" (no la tecla Mayús). (Tenía la esperanza de que despediría si simplemente la tecla de mayúsculas solo se ha pulsado.)

var shifted = false; 

$(function() {       
    $(document).keypress(function(e) { 
     shifted = e.shiftKey; 
     alert('shiftkey='+e.shiftkey); 
    }); 

    $(document).keyup(function(e) { 
     shifted = false; 
    }); 
} 

... 

function myfunction() { 
    //shift is always false b/c keypress not fired above 
} 

Answer 1

Para eventos de ratón, sé que en Firefox al menos la propiedad "shiftKey" en el objeto de evento le dirá si el cambio la llave está abajo. Está documentado en MSDN, pero no lo he probado para siempre, así que no recuerdo si IE hace esto bien.

Por lo tanto, debería poder verificar "shiftKey" en el objeto de evento en su controlador "click".

Answer 2

El evento keypress no se activa por todos los navegadores cuando se hace clic cambio o ctrl, pero afortunadamente the keydown event is.

Si cambia el keypress con keydown puede tener mejor suerte.

Answer 3

$(document).on('keyup keydown', function(e){shifted = e.shiftKey}); 

Answer 4

Aquí está el código de tecla para cada golpe de tecla en JavaScript. Puede usar eso y detectar si el usuario ha presionado la tecla Shift.

backspace   8 
tab     9 
enter    13 
shift    16 
ctrl    17 
alt     18 
pause/break   19 
caps lock   20 
escape    27 
page up    33 
page down   34 
end     35 
home    36 
left arrow   37 
up arrow   38 
right arrow   39 
down arrow   40 
insert    45 
delete    46 
0     48 
1     49 
2     50 
3     51 
4     52 
5     53 
6     54 
7     55 
8     56 
9     57 
a     65 
b     66 
c     67 
d     68 
e     69 
f     70 
g     71 
h     72 
i     73 
j     74 
k     75 
l     76 
m     77 
n     78 
o     79 
p     80 
q     81 
r     82 
s     83 
t     84 
u     85 
v     86 
w     87 
x     88 
y     89 
z     90 
left window key  91 
right window key 92 
select key   93 
numpad 0   96 
numpad 1   97 
numpad 2   98 
numpad 3   99 
numpad 4   100 
numpad 5   101 
numpad 6   102 
numpad 7   103 
numpad 8   104 
numpad 9   105 
multiply   106 
add     107 
subtract   109 
decimal point  110 
divide    111 
f1     112 
f2     113 
f3     114 
f4     115 
f5     116 
f6     117 
f7     118 
f8     119 
f9     120 
f10     121 
f11     122 
f12     123 
num lock   144 
scroll lock   145 
semi-colon   186 
equal sign   187 
comma    188 
dash    189 
period    190 
forward slash  191 
grave accent  192 
open bracket  219 
back slash   220 
close braket  221 
single quote  222 

No todos los navegadores controlar el evento de pulsación de tecla y, por lo use la tecla hacia arriba o el evento pulsada la tecla, como esto:

$(document).keydown(function (e) { 
    if (e.keyCode == 16) { 
     alert(e.which + " or Shift was pressed"); 
    } 
}); 

Answer 5

tuve un problema similar, tratando de capturar un 'cambio de + clic en 'pero como estaba usando un control de terceros con una devolución de llamada en lugar del manejador estándar click, no tuve acceso al objeto de evento y su asociado e.shiftKey.

Terminé manejando el evento de mouse down para registrar el cambio y luego usarlo más tarde en mi devolución de llamada.

var shiftHeld = false; 
    $('#control').on('mousedown', function (e) { shiftHeld = e.shiftKey }); 

Publicado solo en caso de que alguien más termine aquí buscando una solución a este problema.

Answer 6

La excelente biblioteca de JavaScript KeyboardJS maneja todo tipo de pulsaciones de teclas, incluida la tecla MAYÚS. Incluso permite especificar combinaciones de teclas, como presionar primero CTRL + x y luego a.

KeyboardJS.on('shift', function() { ...handleDown... }, function() { ...handleUp... }); 

Si desea una versión simple, diríjase a la answer by @tonycoupland):

var shiftHeld = false; 
$('#control').on('mousedown', function (e) { shiftHeld = e.shiftKey }); 

Answer 7

var shiftDown = false; 
this.onkeydown = function(evt){ 
    var evt2 = evt || window.event; 
    var keyCode = evt2.keyCode || evt2.which;  
    if(keyCode==16)shiftDown = true; 
} 
this.onkeyup = function(){ 
    shiftDown = false; 
} 

demo

Answer 8

Esto funciona muy bien para mí:

function listenForShiftKey(e){ 
    var evt = e || window.event; 
    if (evt.shiftKey) { 
     shiftKeyDown = true; 
    } else { 
     shiftKeyDown = false; 
    } 
} 

Answer 9

tengo usó un método para probar t si cualquier tecla específica se presiona mediante el almacenamiento de los códigos de teclas actualmente prensadas en una matriz:

var keysPressed = [], 
    shiftCode = 16; 

$(document).on("keyup keydown", function(e) { 
    switch(e.type) { 
     case "keydown" : 
      keysPressed.push(e.keyCode); 
      break; 
     case "keyup" : 
      var idx = keysPressed.indexOf(e.keyCode); 
      if (idx >= 0) 
       keysPressed.splice(idx, 1); 
      break; 
    } 
}); 

$("a.shifty").on("click", function(e) { 
    e.preventDefault(); 
    console.log("Shift Pressed: " + (isKeyPressed(shiftCode) ? "true" : "false")); 
}); 

function isKeyPressed(code) { 
    return keysPressed.indexOf(code) >= 0; 
} 

Here is the jsfiddle

Answer 10

Un enfoque más modular además de la capacidad para mantener su alcance this en los oyentes:

var checkShift = function(fn, self) { 
    return function(event) { 
    if (event.shiftKey) { 
     fn.call(self, event); 
    } 
    return true; 
    }; 
}; 

$(document).on('keydown', checkShift(this.enterMode, this)); 

Answer 11

Si alguien busca detectar una clave determinada y necesita conocer el estado de los "modificadores" (como se llaman en Java), es decir, las teclas Shift, Alt y Control, puede hacer algo como esto, que responde al keydown en la tecla F9, pero solo si no está presionada ninguna de las teclas Shift, Alt o Control.

jqMyDiv.on('keydown', function(e){ 
    if(! e.shiftKey && ! e.altKey && ! e.ctrlKey){ 
     console.log(e); 
     if(e.originalEvent.code === 'F9'){ 
      // do something 
     } 
    } 
});