JavaScriptプログラムに関する各種メモ書き

WEBサイトに自由にショートカットキーを設定できる mousetrap

● WEBサイトに自由にショートカットキーを設定できる mousetrap

https://github.com/ccampbell/mousetrap

● mousetrap設定方法

<script src="https://cdnjs.cloudflare.com/ajax/libs/mousetrap/1.6.5/mousetrap.min.js"></script>
// esc を押したとき
Mousetrap.bind('esc', function() { alert('escape'); }, 'keyup');

// ctrl + pを押したとき
Mousetrap.bind('ctrl+p', function () {
    alert('ctrl + p を押しました!');
    return false;
});

// command + p を押した時
Mousetrap.bind('command+p', function () {
    alert('command + p を押しました!');
    return false;
});

return false でデフォルトの動作を kill しています。

● デフォルトでは1行テキストなどのフォーム部品にフォーカスがあたっているときはショートカットが有効になりません

クラス mousetrap をつけます

<input type="text" class="mousetrap" >
No.1771
06/05 17:09

edit