JQuery lub JavaScript: Jak określić, czy klawisz Shift jest naciśnięty podczas klikania hiperłącza znacznika kotwicy?

92

Mam tag kotwicy, który wywołuje funkcję JavaScript.

Z JQuery czy bez, w jaki sposób mogę określić, czy klawisz Shift jest wyłączony, gdy kliknięto łącze?

Poniższy kod NIE działa, ponieważ naciśnięcie klawisza jest uruchamiane tylko wtedy, gdy zostanie naciśnięty „prawdziwy klawisz” (nie klawisz Shift). (Miałem nadzieję, że się uruchomi, jeśli zostanie naciśnięty tylko klawisz Shift).

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
}
Pete Alvin
źródło
4
poniższy kod również nie działa, ponieważ shiftkeyzamiast tego wpisałeś shiftKey:-)
Simon_Weaver
Jeśli chcesz to wiedzieć, aby uniknąć wywołania obsługi podczas naciskania shift+click, użyjfilter-altered-clicks
fregante

Odpowiedzi:

100
    $(document).on('keyup keydown', function(e){shifted = e.shiftKey} );
hluk
źródło
21
To zadziałało dla mnie, ale przerwało wszystkie standardowe skróty, które nie dotyczyły shiftod czasu powrotu funkcji false. Musiałem wyraźnie return truezezwolić na crtl + r, ctrl + s, ctrl + p itp.
John H
4
Więc sugeruje się użycie keydown zamiast klawisza.
rwitzel
Dziwne, dostaję tylko keydown wydarzenia, bez klucza.
Gerry,
@rwitzel keydown i keyup pozwalają śledzić rzeczywisty stan klawisza Shift, gdy są one uruchamiane dla każdego klawisza na klawiaturze. Naciśnięcie klawisza nie zawsze jest uruchamiane, np. Nie jest uruchamiane, gdy naciśnięty jest tylko klawisz Shift.
jakubiszon
@Gerry, możliwe, że na Twojej stronie znajduje się inny moduł obsługi zdarzeń, który przerywa łańcuch zdarzeń. Najpierw sprawdź pustą / nową stronę (taką, która nie zawiera wszystkich twoich skryptów) - będzie działać dobrze.
jakubiszon
74

Oto kod klucza dla każdego naciśnięcia klawisza w JavaScript. Możesz tego użyć i wykryć, czy użytkownik nacisnął klawisz 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

Nie wszystkie przeglądarki dobrze radzą sobie ze zdarzeniem naciśnięcia klawisza, więc użyj zdarzenia klawisz w górę lub w dół, na przykład:

$(document).keydown(function (e) {
    if (e.keyCode == 16) {
        alert(e.which + " or Shift was pressed");
    }
});
Jsinh
źródło
plus 1 za wysiłek włożony w tę odpowiedź
Ian Wise,
1
Użyj event.keyzamiast tego! Otrzymasz znak bezpośrednio, np. „A”, „1”, „LeftArrow”
Gibolt,
Jeszcze lepiej w wersji VanillaJS:document.addEventListener("keydown", function(e){ console.log(e.which); });
Evgeny
26

W przypadku zdarzeń myszy wiem, że w Firefoksie przynajmniej właściwość „shiftKey” obiektu zdarzenia informuje, czy klawisz Shift jest wciśnięty. Jest to udokumentowane w MSDN, ale nie próbowałem tego od zawsze, więc nie pamiętam, czy IE robi to dobrze.

Dlatego powinno być możliwe sprawdzenie „shiftKey” w obiekcie zdarzenia w module obsługi „kliknięcia”.

Spiczasty
źródło
2
W rzeczy samej. Tak było już od najwcześniejszych dni JavaScript.
bobince
23

Miałem podobny problem, próbując uchwycić `` shift + click '', ale ponieważ korzystałem z kontrolki innej firmy z wywołaniem zwrotnym, a nie standardowej clickobsługi, nie miałem dostępu do obiektu zdarzenia i skojarzonego z nim obiektu e.shiftKey.

Skończyło się na obsłudze zdarzenia wciśnięcia myszy, aby zapisać zmianę, a następnie użyłem go później w moim wywołaniu zwrotnym.

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

Opublikowane na wypadek, gdyby ktoś inny znalazł się tutaj, szukając rozwiązania tego problemu.

tonycoupland
źródło
7

keypressZdarzenie nie jest wyzwalany przez wszystkie przeglądarki po kliknięciu shiftlub ctrl, ale na szczęście Impreza .keydown

Jeśli zmienisz keypressz, keydownmożesz mieć więcej szczęścia.

Chris Van Opstal
źródło
1
No ale problem polega na tym, że nie będzie wiedział na pewno, czy klawisz Shift jest wciśnięty. Och, ale wydaje mi się, że jeśli flaga jest ustawiona również na „keyUp”, można by wykryć, kiedy „kliknięcie” jest umieszczone w nawiasach kluczowych zdarzeń.
Pointy
6

Użyłem metody, aby sprawdzić, czy jakikolwiek konkretny klawisz jest naciśnięty, przechowując kody aktualnie naciśniętego klawisza w tablicy:

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;
}

Oto plik jsfiddle

Corey
źródło
3
Fajne rozwiązanie, ale wymaga drobnej poprawki przy keyup: while (idx> = 0) {keysPressed.splice (idx, 1); idx = avpg.keysPressed.indexOf (e.keyCode); } W przeciwnym razie usuwane jest tylko pierwsze wystąpienie naciśnięcia klawisza. Aby to zauważyć, przytrzymaj klawisz Shift przez kilka sekund. Tablica zapełnia się kodami przesunięć, ale tylko jeden z nich jest usuwany podczas keyup.
pkExec
4

Doskonała biblioteka JavaScript KeyboardJS obsługuje wszystkie typy naciśnięć klawiszy, w tym klawisz SHIFT. Pozwala nawet na określenie kombinacji klawiszy, takich jak najpierw naciśnięcie CTRL + x, a następnie a.

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

Jeśli chcesz prostą wersję, przejdź do odpowiedzi @tonycoupland ):

var shiftHeld = false;
$('#control').on('mousedown', function (e) { shiftHeld = e.shiftKey });
koppor
źródło
@downvoters: Proszę zostaw komentarz, dlaczego głosujesz przeciw
koppor
3

To działa świetnie dla mnie:

function listenForShiftKey(e){
    var evt = e || window.event;
    if (evt.shiftKey) {
      shiftKeyDown = true;
    } else {
      shiftKeyDown = false;
    }
}
kaleazy
źródło
3

Aby sprawdzić, czy klawisz shift jest naciśnięty podczas klikania myszą , w obiekcie zdarzenia kliknięcia znajduje się dokładna właściwość : shiftKey (a także dla ctrl i alt oraz meta key): https://www.w3schools.com/jsref/event_shiftkey .żmija

Więc używając jQuery:

$('#anchor').on('click', function (e) {
    if (e.shiftKey) {
        // your code
    }
});
bugovicsb
źródło
2

Bardziej modułowe podejście oraz możliwość utrzymania thiszakresu w słuchaczach:

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

$(document).on('keydown', checkShift(this.enterMode, this));
Rob Fox
źródło
1

Jeśli ktoś chce wykryć dany klawisz i potrzebuje znać status „modyfikatorów” (jak się je nazywa w Javie), czyli klawiszy Shift, Alt i Control, można zrobić coś takiego, co odpowiada keydownna klawisz F9, ale tylko wtedy, gdy żaden z klawiszy Shift, Alt lub Control nie jest aktualnie wciśnięty.

jqMyDiv.on( 'keydown', function( e ){
    if( ! e.shiftKey && ! e.altKey && ! e.ctrlKey ){
        console.log( e );
        if( e.originalEvent.code === 'F9' ){
          // do something 
        }
    }
});
mike gryzoń
źródło
0
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;
}

próbny


źródło