有什么方法可以创建 TouchEvents 或在 Firefox 中可以作为其中之一的东西吗？答案

【问题标题】：Is there any way to create TouchEvents or something that works as one in Firefox?有什么方法可以创建 TouchEvents 或在 Firefox 中可以作为其中之一的东西吗？
【发布时间】：2019-03-30 00:00:57
【问题描述】：

我正在尝试编写一个可以创建人工TouchEvents 的浏览器插件。到目前为止，我可以在 Chrome 中使用它，但 Firefox 似乎不支持TouchEvents，因为尝试使用new TouchEvent(...) 创建一个会产生：

ReferenceError: TouchEvent is not defined

我想知道是否有某种方法可以让我自己在插件中实现TouchEvent，或者以其他方式调度一个具有所有必要属性的事件，如TouchEvent。

但是，如果我创建 CustomEvent 并为其分配必要的额外属性以使其有效地成为 TouchEvent（即 touches、targetTouches 和 changedTouches），则这些属性不会由网页接收事件的时间。

有什么方法可以完成我所追求的，还是我试图让它在 Firefox 中工作时运气不佳？

【问题讨论】：

标签： javascript firefox firefox-addon touch-event

【解决方案1】：

如果其他人有这个问题，这是我找到的解决方案。您可以创建自己的扩展 UIEvent 的类，如下所示：

class TouchEvent extends UIEvent {
    constructor(name, initDict) {
        super(name, initDict);
        this.touches = initDict.touches;
        this.targetTouches = initDict.targetTouches;
        this.changedTouches = initDict.changedTouches;
    }
}

需要注意的是，这些事件必须由与接收它们的处理程序在同一域中运行的脚本构建，否则您将收到Permission denied to access property 错误。我的解决方案是使用我的扩展程序的内容脚本在当前文档的正文中添加一个脚本元素，并将其 textContent 属性设置为我的创建和调度触摸事件的 javascript 代码。

【讨论】：

【解决方案2】：

我无法得到公认的答案，因为我不知道如何构造需要放在initDict 中的touches。这对我有用：

function dispatchTouchEvent(eventName, details) {
    const uiEvent = document.createEvent('UIEvent');
    uiEvent.initUIEvent(eventName, true, true, window, 1);
    const event = Object.assign(uiEvent, {touches: [details]});
    details.target.dispatchEvent(event);
}

下面是如何在坐标 (50, 100) 的 body 元素上使用 touchstart 事件调用它：

dispatchTouchEvent('touchstart', {identifier: 0, target: document.body, pageX: 50, pageY: 100});

出于我的目的，我只需要设置pageX 和pageY 属性，但根据您的操作，可能需要设置clientX、clientY、screenX 或@987654331 @。

【讨论】：