JQuery oder JavaScript: Wie kann festgestellt werden, ob beim Klicken auf den Anker-Tag-Hyperlink die Umschalttaste gedrückt wird?

Ich habe ein Ankertag, das eine JavaScript-Funktion aufruft.

Wie kann ich mit oder ohne JQuery feststellen, ob die Umschalttaste gedrückt ist, während auf den Link geklickt wird?

Der folgende Code funktioniert NICHT, da der Tastendruck nur ausgelöst wird, wenn eine "echte Taste" (nicht die Umschalttaste) gedrückt wird. (Ich hatte gehofft, es würde ausgelöst, wenn nur die Umschalttaste gedrückt würde.)

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
}

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

Hier ist der Schlüsselcode für jeden Tastenanschlag in JavaScript. Sie können dies verwenden und feststellen, ob der Benutzer die Umschalttaste gedrückt hat.

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

Nicht alle Browser verarbeiten das Tastendruckereignis gut. Verwenden Sie daher entweder das Tastendruck- oder das Tastendruckereignis wie folgt:

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

Bei Mausereignissen weiß ich, dass in Firefox zumindest die Eigenschaft "shiftKey" für das Ereignisobjekt anzeigt, ob die Umschalttaste gedrückt ist. Es ist bei MSDN dokumentiert, aber ich habe es nicht für immer ausprobiert, daher kann ich mich nicht erinnern, ob der IE dies richtig macht.

Daher sollten Sie in der Lage sein, das Ereignisobjekt in Ihrem "Klick" -Handler auf "shiftKey" zu überprüfen.

Ich hatte ein ähnliches Problem beim Versuch, ein "Shift + Click" zu erfassen, aber da ich ein Steuerelement eines Drittanbieters mit einem Rückruf anstelle des Standardhandlers verwendete click, hatte ich keinen Zugriff auf das Ereignisobjekt und das zugehörige Objekt e.shiftKey.

Am Ende habe ich das Mouse-Down-Ereignis behandelt, um die Verschiebung aufzuzeichnen und es später in meinem Rückruf zu verwenden.

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

Gepostet für den Fall, dass jemand anderes hier auf der Suche nach einer Lösung für dieses Problem ist.

Das keypressEreignis wird nicht von allen Browsern ausgelöst, wenn Sie auf shiftoder klicken ctrl, aber zum Glück ist es das keydownEreignis .

Wenn Sie das keypressmit keydownausschalten, haben Sie vielleicht mehr Glück.

Ich habe eine Methode verwendet, um zu testen, ob eine bestimmte Taste gedrückt wird, indem die aktuell gedrückten Tastencodes in einem Array gespeichert werden:

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

Hier ist die jsfiddle

Die hervorragende JavaScript-Bibliothek KeyboardJS verarbeitet alle Arten von Tastendrücken, einschließlich der UMSCHALTTASTE. Sie können sogar Tastenkombinationen festlegen, z. B. zuerst STRG + x und dann a drücken.

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

Wenn Sie eine einfache Version wünschen, gehen Sie zur Antwort von @tonycoupland ):

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

Das funktioniert gut für mich:

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

Um zu überprüfen, ob die Umschalttaste beim Klicken mit der Maus gedrückt wird , gibt es eine genaue Eigenschaft im Klickereignisobjekt: shiftKey (und auch für Strg und Alt sowie Metataste): https://www.w3schools.com/jsref/event_shiftkey .asp

Verwenden Sie also jQuery:

$('#anchor').on('click', function (e) {
    if (e.shiftKey) {
        // your code
    }
});

Ein modularerer Ansatz und die Möglichkeit, Ihren thisSpielraum in den Hörern zu behalten :

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

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

Wenn jemand einen bestimmten Schlüssel erkennen möchte und den Status der "Modifikatoren" (wie sie in Java genannt werden) kennen muss, dh Umschalt-, Alt- und Steuertasten, können Sie so etwas tun, das keydownauf Taste F9 reagiert . aber nur, wenn derzeit keine der Umschalt-, Alt- oder Steuertasten gedrückt wird.

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

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