JQuery или JavaScript: как определить, нажата ли клавиша Shift при нажатии гиперссылки тега привязки?

92

У меня есть тег привязки, который вызывает функцию JavaScript.

С JQuery или без него, как определить, нажата ли клавиша Shift при нажатии ссылки?

Следующий код НЕ работает, потому что нажатие клавиши запускается только в том случае, если нажата «настоящая клавиша» (а не клавиша 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
}
Пит Элвин
источник
4
следующий код также не работает, потому что вы ввели shiftkeyвместо shiftKey:-)
Simon_Weaver
Если вам нужно знать это, чтобы не вызывать обработчик при нажатии shift+click, используйтеfilter-altered-clicks
fregante

Ответы:

100
    $(document).on('keyup keydown', function(e){shifted = e.shiftKey} );
глюк
источник
21
Это сработало для меня, но прервало все стандартные ярлыки, которые не использовались shiftс момента возврата функции false. Мне нужно было явно return trueразрешить crtl + r, ctrl + s, ctrl + p и т. Д.
John H
4
Таким образом, предлагается использовать нажатие клавиши вместо нажатия клавиши.
rwitzel
Странно, я получаю только события нажатия клавиш, без нажатия клавиш.
Джерри
@rwitzel keydown и keyup позволяют отслеживать фактическое состояние клавиши Shift, поскольку они срабатывают для каждой клавиши на клавиатуре. Нажатие клавиши не всегда запускается, например, не запускается, когда нажата только клавиша Shift.
jakubiszon
@Gerry, возможно, на вашей странице есть другой обработчик событий, который разрывает цепочку событий. Сначала проверьте пустую / новую страницу (та, которая не включает все ваши скрипты) - она ​​будет работать правильно.
jakubiszon
74

Вот код клавиши для каждого нажатия клавиши в 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");
    }
});
Jsinh
источник
плюс 1 за количество усилий, вложенных в этот ответ,
Ian Wise
1
Используйте event.keyвместо этого! Он даст вам символ напрямую, например: «a», «1», «LeftArrow»
Гибольт
Еще лучше в версии VanillaJS:document.addEventListener("keydown", function(e){ console.log(e.which); });
Евгений
26

Что касается событий мыши, я знаю, что в Firefox по крайней мере свойство "shiftKey" объекта события сообщит вам, нажата ли клавиша Shift. Он задокументирован в MSDN, но я не пробовал его вечно, поэтому не помню, правильно ли делает IE.

Таким образом, вы должны иметь возможность проверять "shiftKey" на объекте события в обработчике "click".

Заостренный
источник
2
На самом деле. Так было с самых первых дней JavaScript.
bobince
23

У меня была аналогичная проблема при попытке зафиксировать «shift + щелчок», но поскольку я использовал сторонний элемент управления с обратным вызовом, а не стандартный clickобработчик, у меня не было доступа к объекту события и связанным с нимe.shiftKey .

В итоге я обработал событие нажатия мыши, чтобы записать сдвиг, а затем использовал его позже в моем обратном вызове.

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

Размещено на всякий случай, если кто-то еще окажется здесь в поисках решения этой проблемы.

Тони
источник
7

keypressСобытие не срабатывают все браузеры при нажатии кнопки shiftили ctrl, но , к счастьюkeydown , событие .

Если вы переключитесь keypressс помощью, keydownвам может повезти больше.

Крис Ван Опсталь
источник
1
Но проблема в том, что он не знает наверняка , нажата ли клавиша Shift. О, но я предполагаю, что если флаг также установлен для «keyUp», тогда можно будет определить, когда «щелчок» заключен в скобки ключевыми событиями.
Pointy
6

Я использовал метод, чтобы проверить, нажата ли какая-либо конкретная клавиша, сохранив коды нажатых клавиш в массиве:

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

Кори
источник
3
Классное решение, но требует незначительного исправления при нажатии клавиш: while (idx> = 0) {keysPressed.splice (idx, 1); idx = avpg.keysPressed.indexOf (e.keyCode); } В противном случае удаляется только первое нажатие клавиши. Чтобы это заметить, нажмите и удерживайте Shift несколько секунд. Массив заполняется кодами сдвига, но при нажатии удаляется только один из них.
pkExec
4

Отличная библиотека 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 });
Коппор
источник
@downvoters: Пожалуйста, оставьте комментарий, почему вы голосуете против
koppor
3

Это отлично работает для меня:

function listenForShiftKey(e){
    var evt = e || window.event;
    if (evt.shiftKey) {
      shiftKeyDown = true;
    } else {
      shiftKeyDown = false;
    }
}
Калеазы
источник
3

Чтобы проверить, нажата ли клавиша Shift при щелчке мышью , в объекте события щелчка есть точное свойство : shiftKey (а также для ctrl, alt и мета-клавиши): https://www.w3schools.com/jsref/event_shiftkey .asp

Итак, используя jQuery:

$('#anchor').on('click', function (e) {
    if (e.shiftKey) {
        // your code
    }
});
bugovicsb
источник
2

Более модульный подход плюс возможность держать вашу 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));
Роб Фокс
источник
1

Если кто-то хочет обнаружить данную клавишу и ему нужно знать статус «модификаторов» (как они называются в Java), то есть клавиш Shift, Alt и Control, вы можете сделать что-то вроде этого, которое реагирует keydownна клавишу F9, но только если в данный момент не нажата ни одна из клавиш 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 
        }
    }
});
Майк грызун
источник
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;
}

демо


источник