JQueryまたはJavaScript：アンカータグのハイパーリンクをクリックしているときにShiftキーが押されているかどうかをどのように判断しますか？

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
}

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

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

すべてのブラウザがkeypressイベントを適切に処理できるわけではないため、次のように、キーアップイベントまたはキーダウンイベントのいずれかを使用します。

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

マウスイベントの場合、Firefoxでは少なくとも、イベントオブジェクトの "shiftKey"プロパティがShiftキーが押されているかどうかを通知することを知っています。それはMSDNで文書化されていますが、私はそれを永遠に試したことがないので、IEがこれを正しく実行したかどうか思い出しません。

したがって、「クリック」ハンドラーのイベントオブジェクトで「shiftKey」を確認できるはずです。

同様の問題があり、「Shift +クリック」をキャプチャしようとしましたが、標準clickハンドラーではなくコールバックでサードパーティのコントロールを使用していたため、イベントオブジェクトとそれに関連付けられたイベントにアクセスできませんでしたe.shiftKey。

最終的に、マウスダウンイベントを処理してシフトネスを記録し、後でコールバックで使用しました。

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

他の誰かがこの問題の解決策を探してここに到着した場合に備えて投稿されています。

keypressイベントは、あなたがクリックしたときにすべてのブラウザによってトリガされていないshiftかctrl、幸いイベントがあります。keydown

あなたが出て切り替える場合keypressとkeydown、あなたはより良い運を持っているかもしれません。

メソッドを使用して、現在押されているキーコードを配列に格納することにより、特定のキーが押されたかどうかをテストしました。

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があります

優れた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 });

これは私にとってはうまくいきます：

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

マウスでクリックしているときにシフトキーが押されたかどうかを確認するために、クリックイベントオブジェクトに次の正確なプロパティがあります：shiftKey（およびctrlとaltおよびメタキーの場合）： https .asp

したがって、jQueryを使用します。

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

よりモジュール化されたアプローチに加えて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));

誰かが特定のキーを検出するために探していて、「修飾子」（Javaで呼び出される）のステータス（Shift、Alt、Controlキーなど）を知る必要がある場合、keydownキーF9 で応答するこのようなことを行うことができます。ただし、Shift、Alt、またはCtrlキーのいずれも現在押されていない場合のみ。

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

デモ