Javascript shortcut keys in mootools, zkratkové klávesy v javascriptu

Jak na zkratkové klávesy v javascriptu? Měli jste někdy potřebu spouštět nějakou javascript funkci třeba na stlačení CTRL + SHIFT + F? V mootools je to velice snadné.


Tento návod je postaven na javascript frameworku mootools. Framework mootools mám rád. Můžete si vybrat jakou funkčnost potřebujete a přímo na stránkách mootools generovat jen potřebný balík kódu. Navíc v celkové velikosti má tento framework pod 100kB, což považuji za plus. Někteří namítají, že je invazivní, tedy mění přímo vestavěné js objekty a funkce, ale to je věc názoru, zda je to plus nebo mínus. Co se týče rychlosti dosahuje celkem zajímavých hodnot.

Čas od času by se Vám mohlo hodit volat nějakou funkci na základě stisknutí zkratkových kláves. Mimo jiné budeme potřebovat odchytit stlačenou klávesu ctrl nebo shift. Pokud nepoužíváte žádný framework zkuste hledat pod e.ctrlKey nebo e.shiftKey (indikují zda jsou klávesy shift nebo ctrl zmáčknuty). Tady je krátký příklad, který používám pro zkratku CTRL + SHIFT + F, která otevře interní formulář pro hledání. Z balíku mootools budeme potřebovat Events.

  1. /* CTRL + SHIFT + F - filter function */
  2. window.addEvent('keydown', ShowFilterBox);
  3. function ShowFilterBox(e) {
  4. var event = new Event(e);
  5. // pokud bychom chtěli aby se další akce neprovedli (např. při stisku ctrl + f neotevřel vestavěný box prohlížeče pro vyhledávání) na další řádek bychom napsali event.stop();
  6. if (event.control && event.shift && (event.key=='f')) {
  7. open filter box; // vlastní funkčnost nahraďte
  8. $('input_filtr_search').focus(); // nastaví kurzor do pole pro psaní vyhledávaného výrazu, input má id 'input_filtr_search', dále by se hodilo select() pro označení obsahu pole
  9. }
  10. }