JQuery 또는 JavaScript : 앵커 태그 하이퍼 링크를 클릭하는 동안 Shift 키를 눌렀는지 확인하는 방법은 무엇입니까?

Question 1

JavaScript 함수를 호출하는 앵커 태그가 있습니다.

JQuery를 사용하거나 사용하지 않고 링크를 클릭하는 동안 Shift 키가 눌러져 있는지 어떻게 확인합니까?

다음 코드는 "실제 키"(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
}

Question 2

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

Question 3

다음은 JavaScript의 각 키 입력에 대한 키 코드입니다. 이를 사용하여 사용자가 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

모든 브라우저가 키 누르기 이벤트를 잘 처리하는 것은 아니므로 다음과 같이 키 업 또는 키 다운 이벤트를 사용하십시오.

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

Question 4

마우스 이벤트의 경우 Firefox에서 이벤트 개체의 "shiftKey"속성이 Shift 키가 눌려 있는지 여부를 알려줍니다. MSDN에 문서화되어 있지만 영원히 시도하지 않았으므로 IE가 올바르게 작동하는지 기억하지 못합니다.

따라서 "클릭"처리기의 이벤트 개체에서 "shiftKey"를 확인할 수 있어야합니다.

Question 5

유사한 문제가 발생하여 'shift + click'을 캡처하려고했지만 표준 click핸들러가 아닌 콜백과 함께 타사 컨트롤을 사용하고 있었기 때문에 이벤트 개체 및 관련 e.shiftKey.

나는 마우스 다운 이벤트를 처리하여 이동성을 기록한 다음 나중에 콜백에서 사용했습니다.

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

다른 사람이이 문제에 대한 해결책을 찾기 위해 여기에 올 경우를 대비하여 게시됩니다.

Question 6

keypress클릭 할 때 이벤트는 모든 브라우저에 의해 촉발되지 shift나 ctrl, 그러나 다행히도 이벤트입니다 .keydown

keypress함께 전환하면 keydown운이 더 좋을 수 있습니다.

Question 7

현재 누른 키 코드를 배열에 저장하여 특정 키를 눌렀는지 테스트하는 방법을 사용했습니다.

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

다음은 jsfiddle입니다.

Question 8

뛰어난 JavaScript 라이브러리 KeyboardJS 는 SHIFT 키를 포함한 모든 유형의 키 누름을 처리합니다. 먼저 CTRL + x를 누른 다음 a를 누르는 것과 같은 키 조합을 지정할 수도 있습니다.

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

간단한 버전 을 원하면 @tonycoupland 의 답변으로 이동 하십시오.)

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

Question 9

이것은 나를 위해 잘 작동합니다.

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

Question 10

마우스로 클릭하는 동안 shiftkey가 눌 렸는지 확인하기 위해 click 이벤트 개체에 정확한 속성 이 있습니다 . shiftKey (및 ctrl 및 alt 및 meta 키의 경우) : https://www.w3schools.com/jsref/event_shiftkey .asp

따라서 jQuery를 사용합니다.

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

Question 11

보다 모듈화 된 접근 방식과 this청취자에게 범위 를 유지하는 기능 :

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

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

Question 12

누군가 주어진 키를 감지하고 "수정 자"의 상태 (Java에서 호출 됨), 즉 Shift, Alt 및 Control 키를 알아야하는 경우 다음과 같이 수행 할 수 있습니다. 이는 keydownF9 키에 응답합니다 . 그러나 현재 Shift, Alt 또는 Control 키를 누르지 않은 경우에만 해당됩니다.

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

Question 13

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

데모