web-dev-qa-db-ja.com

Webアプリケーション用のJavaScriptキーボードショートカット

（理想的には）キーボードを介して完全に使用できるWebアプリケーションを開発したいと思います。 JavaScriptでキーボードイベントを処理する方法は知っていますが、より大きなアプリケーションでキーボードイベントを管理するのは非常に退屈です。

そのプロセスを簡単にするライブラリはありますか？

本格的なWebGUIフレームワークには興味がないことに注意してください。 Webページ/アプリケーションを引き続き管理したい。

javascriptkeyboard-shortcutsaccessibilityaccess-keys
26
Achim

私のプロジェクトをチェックしてください：

https://github.com/oscargodson/jkey

そしてデモ：

http://oscargodson.github.com/jKey/

自由に使用して、必要に応じて貢献してください:)

34
Oscar Godson

Mousetrap という独自の開発を行いました。見てみな。

16
Craig

Hotkeys -jQueryのプラグインを使用できます。 jQueryは非常に軽量なJavaScriptライブラリであり、ホットキーを使用するために必要なJavaScriptファイルです。

10
lord_t

accesskey属性 について読むことから始めることができます：

この属性は、要素にアクセスキーを割り当てます。アクセスキーは、ドキュメントの文字セットからの1文字です。注意。作成者は、アクセスキーを指定するときに、予想されるリーダーの入力方法を考慮する必要があります。
[...]
アクセスキーの呼び出しは、基盤となるシステムによって異なります。たとえば、MS Windowsを実行しているマシンでは、通常、アクセスキーに加えて「alt」キーを押す必要があります。 Appleシステムでは、通常、アクセスキーに加えて「cmd」キーを押す必要があります。

accesskey属性を<a>要素に配置することもできます。この使用例は、 Wikipedia の「ランダム記事」サイドバーリンクにあります。

5
mu is too short

Webアプリケーションでキーボードショートカットを実行するためのThomasFuchsのキーマスターを確認することを強くお勧めします： https://github.com/madrobby/keymaster

それはそれを非常に簡単にします：

// Define short of 'a'
key('a', function(){ alert('you pressed a!') });

// Returning false stops the event and prevents default browser events
key('ctrl+r', function(){ alert('stopped reload!'); return false });

// Multiple shortcuts that do the same thing
key('⌘+r, ctrl+r', function(){ });
3
Henrik Joreteg

これ とても使いやすいです。

例：

shortcut.add("Up",     // Key
             go_up()); // Function
2
bfontaine

accesskey HTML属性を使用すると、Webアプリケーションにアクセスできるようになります。

KeyTips jQueryプラグインを使用して、 Officeリボンキーボードショートカット と同様の方法でユーザーに表示します。

Enter image description here

デモをお試しください 。 GitHubのコード 。

accesskeyのWikipediaページ には、さまざまなブラウザのアクセスキーを呼び出すための修飾キーがリストされていることに注意してください。

A List Apartの記事も参照してください： Accesskeys：Unlocking Hidden Navigation

2
Sam Hasler