从触摸屏启用Chrome中的触摸事件

Question

我有一台24英寸触摸屏的Ubuntu机器，它工作得很好。我可以移动鼠标，用几个触摸点做手势等等，所以硬件工作得很好。现在我想知道是否有可能让浏览器将事件解释为触摸，而不是鼠标按下、鼠标拖动等。HTML5对触摸和多点触摸的支持非常好，我想为这种设置开发web应用程序。有人知道怎么做吗?我试过启用--enable- touch -events开关，但没有成功。尽管这似乎只在ms windows版本中实现。

~$ xinput -version
xinput version 1.6.0
XI version on server: 2.2

~$ xinput
⎡ Virtual core pointer                      id=2    [master pointer  (3)]
⎜   ↳ Virtual core XTEST pointer                id=4    [slave  pointer  (2)]
⎜   ↳ Advanced Silicon S.A CoolTouch(TM) System id=9    [slave  pointer  (2)]
⎜   ↳ USBest Technology SiS HID Touch Controller    id=10   [slave  pointer  (2)]
⎜   ↳ Logitech USB Optical Mouse                id=11   [slave  pointer  (2)]
⎜   ↳ MCE IR Keyboard/Mouse (nuvoton-cir)       id=14   [slave  pointer  (2)]
⎣ Virtual core keyboard                     id=3    [master keyboard (2)]
    ↳ Virtual core XTEST keyboard               id=5    [slave  keyboard (3)]
    ↳ Power Button                              id=6    [slave  keyboard (3)]
    ↳ Video Bus                                 id=7    [slave  keyboard (3)]
    ↳ Power Button                              id=8    [slave  keyboard (3)]
    ↳ CHICONY HP Basic USB Keyboard             id=12   [slave  keyboard (3)]
    ↳ Nuvoton w836x7hg Infrared Remote Transceiver  id=13   [slave  keyboard (3)]

我读过关于使用touch-UI标志进行构建的文章，但我不确定它会有帮助吗？

Answer 1

Chrome在使用GTK构建时并不支持Linux上的触摸屏。从Chrome35开始，Linux不再使用GTK，而是构建在Windows和ChromeOS上使用的相同UI框架("Aura")之上。这意味着它现在应该可以正确地支持触摸屏了(尽管我经常在Ubuntu中看到触摸屏错误--尤其是在使用多个显示器的时候)。

Answer 2

有关您的问题的良好答案，请参阅http://www.html5rocks.com/en/mobile/touchandmouse/。

你说

我试过启用--enable-touch-events开关

你是不是用那个命令行开关启动了chrome？

也许你指的是以下内容，因为你想要接收真实的触摸事件，所以在你的例子中使用它并不是错误的。

https://developers.google.com/chrome-developer-tools/docs/mobile-emulation#emulate-touch-events

尝试在JavaScript控制台中为您感兴趣的任何事件类型安装一个小事件处理程序(见下文)。

["click", "mousemove", "touchmove"].forEach(function(value, index, object) {
    document.addEventListener(value, function(event) {
        console.log(JSON.stringify([event.type,
            event.srcElement.localName + (event.srcElement.id ? '#'
            + event.srcElement.id : "")
            + (event.srcElement.classList.length ? '[class='
            + event.srcElement.classList + ']' : ""),
            (new Date(event.timeStamp)).toJSON()]));
    }, false);
});

这有帮助吗？