Поддерживает ли TypeScript TouchEvent?

Question

UPDATE

TypeScript 1.5.3 added declarations for HTML Touch events to lib.d.ts

Я могу видеть, что он поддерживает UIEvent, но это, кажется, не имеют интерфейсы для сенсорных событий.

Этот код указывает, что «TouchEvent не существует в текущей области действия».

class Touchy { 
    private _element:Element; 

    constructor(theElement:Element) { 
     this._element = theElement; 

     theElement.addEventListener("touchstart", (theTouchEvent:TouchEvent) => alert("touchy")); 
    } 
} 

Я могу использовать UIEvent, но не TouchEvent. Как мне обрабатывать TouchEvent с помощью TypeScript? Благодарю.

Answer 1

У вас есть несколько вариантов здесь:

Первого варианта: Продлить UIEvent иметь член можно было ожидать на TouchEvent (и использовать их только в слушателях сенсорных событий):

interface UIEvent { 
    targetTouches: { pageX: number; pageY: number; }[]; 
    // etc... 
} 

Второго вариант : Определите свой собственный интерфейс TouchEvent и добавьте утверждение типа при привязке события

interface TouchEvent { 
    (event: TouchEventArgs): void; 
} 

interface TouchEventArgs { 
    targetTouches: { pageX: number; pageY: number; }[]; 
    // etc 
} 

theElement.addEventListener("touchstart", <UIEvent>((theTouchEvent:TouchEvent) => alert("touchy"))); 

Answer 2

спасибо за совет. Я отправился на рабочий проект W3C для работы с сенсорными событиями 05 мая 2011 года и создал из него набор эмбиентных объявлений. Существует более новая рекомендация кандидата, но это то, что, на мой взгляд, фактически реализовано в большинстве браузеров. Кажется, это хорошо работает.

PS: объявить var TouchEvent внизу не является частью черновика w3c. Это адаптация того же кода для UIEvent, который является частью стандартных интерфейсов, поставляемых с TypeScript.

interface Touch { 
    identifier:number; 
    target:EventTarget; 
    screenX:number; 
    screenY:number; 
    clientX:number; 
    clientY:number; 
    pageX:number; 
    pageY:number; 
}; 

interface TouchList { 
    length:number; 
    item (index:number):Touch; 
    identifiedTouch(identifier:number):Touch; 
}; 

interface TouchEvent extends UIEvent { 
    touches:TouchList; 
    targetTouches:TouchList; 
    changedTouches:TouchList; 
    altKey:bool; 
    metaKey:bool; 
    ctrlKey:bool; 
    shiftKey:bool; 
    initTouchEvent (type:string, canBubble:bool, cancelable:bool, view:AbstractView, detail:number, ctrlKey:bool, altKey:bool, shiftKey:bool, metaKey:bool, touches:TouchList, targetTouches:TouchList, changedTouches:TouchList); 
}; 

declare var TouchEvent: { 
    prototype: TouchEvent; 
    new(): TouchEvent; 
} 

Answer 3

Приведено дополнение. Этот код добавляет обработчики событий типа к элементу HTMLElement. Вы можете добавить это после кода, который определяет интерфейс TouchEvent;

// 
// add touch events to HTMLElement 
// 
interface HTMLElement extends Element, MSHTMLElementRangeExtensions, ElementCSSInlineStyle, MSEventAttachmentTarget, MSHTMLElementExtensions, MSNodeExtensions { 
    ontouchstart: (ev: TouchEvent) => any; 
    ontouchmove: (ev: TouchEvent) => any; 
    ontouchend: (ev: TouchEvent) => any; 
    ontouchcancel: (ev: TouchEvent) => any; 
}