Prototyp - obsługa zdarzeń

Zarządzanie zdarzeniami to jedno z największych wyzwań przy wykonywaniu skryptów w różnych przeglądarkach. Każda przeglądarka ma inne podejście do obsługi naciśnięć klawiszy.

Prototype Framework rozwiązuje wszystkie problemy ze zgodnością z różnymi przeglądarkami i pozwala uniknąć wszelkich problemów związanych z zarządzaniem zdarzeniami.

Prototype Framework udostępnia przestrzeń nazw Event , która jest pełna metod, które wszystkie przyjmują bieżący obiekt zdarzenia jako argument i szczęśliwie wytwarzają żądane informacje we wszystkich głównych przeglądarkach.

Przestrzeń nazw zdarzeń zawiera również znormalizowaną listę kodów kluczy, których można używać ze zdarzeniami związanymi z klawiaturą. W przestrzeni nazw zdefiniowano następujące stałe -

S.No.	Kluczowa stała i opis
1.	KEY_BACKSPACE Reprezentuj klawisz spacji.
2.	KEY_TAB Reprezentuj klawisz tabulacji.
3.	KEY_RETURN Reprezentują klucz powrotu.
4.	KEY_ESC Reprezentuj klawisz esc.
5.	KEY_LEFT Reprezentują lewy klawisz.
6.	KEY_UP Reprezentuj klucz.
7.	KEY_RIGHT Reprezentują właściwy klucz.
8.	KEY_DOWN Reprezentuj klawisz dolny.
9.	KEY_DELETE Reprezentują klawisz usuwania.
10.	KEY_HOME Reprezentuj klucz domowy.
11.	KEY_END Reprezentują klawisz zakończenia.
12.	KEY_PAGEUP Reprezentuj klawisz w górę.
13.	KEY_PAGEDOWN Reprezentuj klawisz strony w dół.

Jak obsługiwać zdarzenia

Zanim zaczniemy, zobaczmy przykład użycia metody zdarzenia. Ten przykład pokazuje, jak przechwycić element DOM, na którym wystąpiło zdarzenie.

Przykład

<html>
   <head>
      <title>Prototype examples</title>
      <script type = "text/javascript" src = "/javascript/prototype.js"></script>
      
      <script>
         // Register event 'click' and associated call back.
         Event.observe(document, 'click', respondToClick);
  
         // Callback function to handle the event.
         function respondToClick(event) {
            var element = event.element();
            alert("Tag Name : " + element.tagName );
         }
      </script>
   </head>

   <body>
      <p id = "note"> Click on any part to see the result.</p>
      <p id = "para">This is paragraph</p>
      <div id = "division">This is divsion.</div>
   </body>
</html>

Wynik

Oto pełna lista wszystkich metod związanych z Event. Funkcje, z których najprawdopodobniej będziesz często korzystać, to obserwacja , element i zatrzymywanie .

Prototypowe metody zdarzeń

NOTE - Upewnij się, że masz co najmniej wersję 1.6 pliku prototype.js.

S.No.	Metoda i opis
1.	element() Zwraca element DOM, w którym wystąpiło zdarzenie.
2.	poszerzać() Rozszerza zdarzenie o wszystkie metody zawarte w Event.Methods.
3.	findElement () Zwraca pierwszy element DOM o podanej nazwie tagu w górę od tego, na którym nastąpiło zdarzenie.
4.	isLeftClick () Określa, czy zdarzenie myszy związane z przyciskiem dotyczyło „lewego” (właściwie głównego) przycisku.
5.	przestrzegać() Rejestruje procedurę obsługi zdarzeń w elemencie DOM.
6.	pointerX () Zwraca bezwzględne położenie poziome zdarzenia myszy.
7.	pointerY () Zwraca bezwzględne położenie w pionie dla zdarzenia myszy.
8.	zatrzymać() Zatrzymuje propagację zdarzenia i zapobiega w końcu wywołaniu jego domyślnej akcji.
9.	stopObserving () Wyrejestrowuje procedurę obsługi zdarzeń.
10.	unloadCache () Wyrejestrowuje wszystkie programy obsługi zdarzeń zarejestrowane za pomocą programu follow. Automatycznie połączone dla Ciebie. Niedostępne od 1.6.