jQueryでクリック時にShiftキーとかCtrlキーなどが一緒に押されたかを判定する

jQuery Advent Calendar 2014 - Adventar、3日目の記事です。
もの凄いライトなネタです。

今関わっている案件で、「リンクを新規タブで開かせたくない」という要望があったので調べていたら、
ちょうど使っていたColorboxのコードにあったのでメモしておきます。

特定のキーならクリック時のeventオブジェクトで取得できる

.click()イベントのコールバック関数で受け取ることが出来るeventオブジェクトには、特定のキーが押されたかが取得できるんですね。
知らなかった...。
ちなみに取得できるのは以下のとおり。

• ctrlキー
• shiftキー
• altキー
• cmdキー
• クリックの種類(左クリック/中クリック/右クリック)

それぞれ次のように取得できます。

jQuery(elem).on('click', function(event) {
  // ctrlキーが押されていたらtrue
  event.ctrlKey;

  // shiftキーが押されていたらtrue
  event.shiftKey;

  // altキーが押されていたらtrue
  event.altKey;

  // cmdキー(mac)が押されていたらtrue
  event.metaKey;

  // クリックの種類(1: 左クリック/2: 中クリック/3: 右クリック)
  event.which;
});

これを利用して下記のようなコードで要件を満たすことが出来ました。

jQuery('a').on('click keypress', function(event) {
  if(e.metaKey || e.altKey || e.shiftKey || e.which > 1) {
    e.preventDefault();

    location.href = $(this).attr('href');
  }
});

まあ新規タブを開いてURLをコピペされたら意味ないんですけどね,､('∀) '`,､
こういうことも出来るよ、ということで。

明日はjkr_2255さんです。
よろしくお願いします！