MouseEvent#
new WheelEvent()#
Interfejs WheelEvent może być wywoływany w roli konstruktora, dzięki czemu pozwala na bezpośrednie tworzenie nowych zdarzeń kółka (syntetycznych) wprost z interfejsu. Przy tworzeniu nowego zdarzenia od razu ustalany jest jego typ (pierwszy argument) oraz specyficzne cechy ustawiane za pomocą opcjonalnego słownika WheelEventInit (drugi argument).
Składnia#
Samo wywołanie i poszczególne jego części najlepiej objaśnić na zapisie składniowym:
var new_wheelEvent = new WheelEvent(type [, wheelEventInitDict]);
gdzie poszczególne człony oznaczają:
new_wheelEvent- referencja do nowego zdarzenia.type- typ zdarzenia w postaci łańcucha znakowego. Może to być dowolny łańcuch znakowy (nawet pusty).wheelEventInitDict- opcjonalny obiekt określający szczegółowe kryteria inicjalizacji zdarzenia. Oto dostępne właściwości dla obiektu:bubbles- boolowskietrueoznacza, że zdarzenie zezwala na obsługę fazy bąbelkowania. Domyślną wartością jest boolowskiefalse(dziedziczone z EventInit).cancelable- boolowskietrueoznacza, że domyślne akcje dla zdarzenia mogą zostać anulowane. Domyślną wartością jest boolowskiefalse(dziedziczone z EventInit).view- obiekt okna lub wartośćnull. Domyślną wartością jest wartośćnull(dziedziczone z UIEventInit).detail- szczegółowe informacje w postaci liczby całkowitej. Domyślną wartością jest0(dziedziczone z UIEventInit).screenX- współrzędna pozioma miejsca wystąpienia zdarzenia w stosunku do ekranu urządzenia. Domyślną wartością jest wartość0(dziedziczone z MouseEvent).screenY- współrzędna pionowa miejsca wystąpienia zdarzenia w stosunku do ekranu urządzenia. Domyślną wartością jest0(dziedziczone z MouseEvent).clientX- współrzędna pozioma miejsca wystąpienia zdarzenia w stosunku do obszaru operacyjnego. Domyślną wartością jest0(dziedziczone z MouseEvent).clientY- współrzędna pionowa miejsca wystąpienia zdarzenia w stosunku do obszaru operacyjnego. Domyślną wartością jest0(dziedziczone z MouseEvent).altKey- boolowskietrueoznacza aktywność klawisza alternatywy w chwili wysłania zdarzenia. Domyślną wartością jest boolowskiefalse(dziedziczone z MouseEvent).ctrlKey- boolowskietrueoznacza aktywność klawisza kontrolnego w chwili wysłania zdarzenia. Domyślną wartością jest boolowskiefalse(dziedziczone z MouseEvent).metaKey- boolowskietrueoznacza aktywność klawisza mety w chwili wysłania zdarzenia. Domyślną wartością jest boolowskiefalse(dziedziczone z MouseEvent).shiftKey- boolowskietrueoznacza aktywność klawisza zmiany w chwili wysłania zdarzenia. Domyślną wartością jest boolowskiefalse(dziedziczone z MouseEvent).button- liczba całkowita reprezentującą aktywność konkretnego przycisku w chwili wysłania zdarzenia. Domyślną wartością jest0(dziedziczone z MouseEvent).buttons- liczba całkowita w postaci maski bitowej reprezentująca stany wszystkich przycisków w chwili wysłania zdarzenia. Domyślną wartością jest wartość0(dziedziczone z MouseEvent).relatedTarget- dodatkowy obiekt, który jest powiązany z nowym zdarzeniem. Domyślną wartością jest wartośćnull(dziedziczone z MouseEvent).deltaX- liczba rzeczywista reprezentująca przewinięcie lub obrót kółka względem osi X. Domyślną wartością jest0.deltaY- liczba rzeczywista reprezentująca przewinięcie lub obrót kółka względem osi Y. Domyślną wartością jest0.deltaZ- liczba rzeczywista reprezentująca przewinięcie lub obrót kółka względem osi Z. Domyślną wartością jest0.deltaMode- liczba całkowita reprezentującą jednostkę pomiaru w układzie współrzędnych. Domyślną wartością jest0.
Na podstawie współrzędnych
clientXiclientYimplementacje mogą obliczać inne współrzędne, jak np. współrzędne celu lub inne rozszerzające właściwości zdarzeń myszy (np.pageXczypageY).
Algorytm wywołania konstruktora new WheelEvent(type, wheelEventInitDict) nie jest skomplikowany. Dla lepszego zrozumienia tematu prezentuję go w całości:
- Zwróć nowe zdarzenie kółka za pomocą algorytmu tworzenia zdarzenia z typem
typei słownikiemwheelEventInitDict(jeśli występuje).
Obiekt zwracany przez konstruktor new WheelEvent() implementuje interfejs WheelEvent, dlatego ma dostęp do wszystkich poleceń z tego interfejsu (oraz z kolejnych interfejsów w łańcuchu dziedziczenia). Warto podkreślić, że i opcjonalny słownik WheelEventInit dziedziczy ze słownika MouseEventInit, dlatego ma dostęp do wszystkich jego członków w chwili przekazania do konstruktora.
Nowy obiekt zdarzenia będzie miał ustawiane domyślne wartości dla wszystkich swoich właściwości i dodatkowo zostanie automatycznie zainicjowany zgodnie z przekazanymi argumentami przy jego wywołaniu, w przeciwieństwie do polecenia Document.createEvent(), dlatego może być od razu wysłany za pomocą metody EventTarget.dispatchEvent().
W ramach uzupełnienia warto przeanalizować wady i zalety poszczególnych poleceń odpowiedzialnych za tworzenie niezaufanych zdarzeń.
Ze względów bezpieczeństwa zdarzenia generowane przy użyciu konstruktora new WheelEvent() muszą ustawiać wartość właściwości Event.isTrusted na boolowskie false.
Prosty przykład:
<script>
// Tworzymy nowe zdarzenie
var wheelEvent1 = new WheelEvent("piesek");
document.write(wheelEvent1); // [object WheelEvent]
document.write("<br>");
document.write(wheelEvent1.type); // piesek
document.write("<br>");
document.write(wheelEvent1.bubbles); // false
document.write("<br>");
document.write(wheelEvent1.cancelable); // false
document.write("<br>");
document.write(wheelEvent1.view); // null
document.write("<br>");
document.write(wheelEvent1.detail); // 0
document.write("<br>");
document.write(wheelEvent1.screenX); // 0
document.write("<br>");
document.write(wheelEvent1.screenY); // 0
document.write("<br>");
document.write(wheelEvent1.clientX); // 0
document.write("<br>");
document.write(wheelEvent1.clientY); // 0
document.write("<br>");
document.write(wheelEvent1.altKey); // false
document.write("<br>");
document.write(wheelEvent1.ctrlKey); // false
document.write("<br>");
document.write(wheelEvent1.metaKey); // false
document.write("<br>");
document.write(wheelEvent1.shiftKey); // false
document.write("<br>");
document.write(wheelEvent1.button); // 0
document.write("<br>");
document.write(wheelEvent1.buttons); // 0
document.write("<br>");
document.write(wheelEvent1.relatedTarget); // null
document.write("<br>");
document.write(wheelEvent1.deltaX); // 0
document.write("<br>");
document.write(wheelEvent1.deltaY); // 0
document.write("<br>");
document.write(wheelEvent1.deltaZ); // 0
document.write("<br>");
document.write(wheelEvent1.deltaMode); // 0
document.write("<br>");
document.write(wheelEvent1.defaultPrevented); // false
document.write("<br>");
document.write(wheelEvent1.isTrusted); // false
document.write("<br>");
document.write(wheelEvent1.eventPhase); // 0
document.write("<br>");
document.write(wheelEvent1.timeStamp); // liczba całkowita z wartością zależną od chwili uruchomienia przykładu
document.write("<br>");
document.write(wheelEvent1.currentTarget); // null
document.write("<br>");
document.write(wheelEvent1.target); // null
document.write("<br><br>");
// Tworzymy kolejne zdarzenie
var wheelEvent2 = new WheelEvent("piesek", {
bubbles: true,
cancelable: true,
view: window,
detail: 69,
screenX: 50,
screenY: 100,
clientX: 150,
clientY: 200,
altKey: true,
ctrlKey: true,
metaKey: true,
shiftKey: true,
button: 1,
buttons: 7,
relatedTarget: document.documentElement,
deltaX: 5.1,
deltaY: 10.2,
deltaZ: 15.3,
deltaMode: 2
});
document.write(wheelEvent2); // [object WheelEvent]
document.write("<br>");
document.write(wheelEvent2.type); // piesek
document.write("<br>");
document.write(wheelEvent2.bubbles); // true
document.write("<br>");
document.write(wheelEvent2.cancelable); // true
document.write("<br>");
document.write(wheelEvent2.view); // [object Window]
document.write("<br>");
document.write(wheelEvent2.detail); // 69
document.write("<br>");
document.write(wheelEvent2.screenX); // 50
document.write("<br>");
document.write(wheelEvent2.screenY); // 100
document.write("<br>");
document.write(wheelEvent2.clientX); // 150
document.write("<br>");
document.write(wheelEvent2.clientY); // 200
document.write("<br>");
document.write(wheelEvent2.altKey); // true
document.write("<br>");
document.write(wheelEvent2.ctrlKey); // true
document.write("<br>");
document.write(wheelEvent2.metaKey); // true
document.write("<br>");
document.write(wheelEvent2.shiftKey); // true
document.write("<br>");
document.write(wheelEvent2.button); // 1
document.write("<br>");
document.write(wheelEvent2.buttons); // 7
document.write("<br>");
document.write(wheelEvent2.relatedTarget); // [object HTMLHtmlElement]
document.write("<br>");
document.write(wheelEvent2.deltaX); // 5.1
document.write("<br>");
document.write(wheelEvent2.deltaY); // 10.2
document.write("<br>");
document.write(wheelEvent2.deltaZ); // 15.3
document.write("<br>");
document.write(wheelEvent2.deltaMode); // 2
document.write("<br>");
document.write(wheelEvent2.defaultPrevented); // false
document.write("<br>");
document.write(wheelEvent2.isTrusted); // false
document.write("<br>");
document.write(wheelEvent2.eventPhase); // 0
document.write("<br>");
document.write(wheelEvent2.timeStamp); // liczba całkowita z wartością zależną od chwili uruchomienia przykładu
document.write("<br>");
document.write(wheelEvent2.currentTarget); // null
document.write("<br>");
document.write(wheelEvent2.target); // null
</script>Na chwilę obecną wszystkie aktualne przeglądarki pozwalają na wywoływanie interfejsu WheelEvent w roli konstruktora, oczywiście z wyjątkiem IE11.
Interfejs Web IDL#
[Constructor(DOMString type, optional WheelEventInit wheelEventInitDict)]
interface WheelEvent : MouseEvent {
};
dictionary WheelEventInit : MouseEventInit {
double deltaX = 0.0;
double deltaY = 0.0;
double deltaZ = 0.0;
unsigned long deltaMode = 0;
};