39

我有一个非常具体的问题。我正在为手机写一个网页，上面有一个按钮。我正在检测touchevent包括 IE 在内的每个浏览器，但在 IE 上它非常具体。几秒钟后它会自动结束。你能以某种方式帮助我吗？这是我的代码（修改了一个，但仍然无法正常工作）：

if (window.navigator.pointerEnabled) {
    tapButton.addEventListener("pointerup", function(e) {
        e.preventDefault();
        addClass(this, 'clicked');
        buttonTouched = true;
    }, false);
    tapButton.addEventListener("pointerdown", function(e) {
        e.preventDefault();
        removeClass(this, 'clicked');
        buttonTouched = false;
    }, false);
    alert("pointerEnabled");
}
else if (window.navigator.msPointerEnabled) {
    tapButton.addEventListener("MSPointerDown", function(e) {
        e.preventDefault();
        addClass(this, 'clicked');
        buttonTouched = true;
    }, false);
    tapButton.addEventListener("MSPointerUp", function(e) {
        e.preventDefault();
        removeClass(this, 'clicked');
        buttonTouched = false;
    }, false);
    alert("mspointerEnabled");
}
else {
    alert("ordinary touch");
    tapButton.addEventListener('touchstart', function(e) {
        e.preventDefault();
        addClass(this, 'clicked');
        buttonTouched = true;
    }, false);
    tapButton.addEventListener('touchend', function(e) {
        e.preventDefault();
        removeClass(this, 'clicked');
        buttonTouched = false;
    }, false);
}

并且其中包含 html 标签：

-ms-touch-action: none !important;
touch-action: none !important;

但这也无济于事。

4

1 回答 1

1

我怀疑您遇到了多点触控问题...

请记住，触摸事件与鼠标事件不同。您可以用一根以上的手指触摸。如果你用一根手指触摸而不是添加第二根手指会发生什么？你得到两个连续touchstart的事件。可能也是如此touchend。我怀疑用户light是对的，它可能错误地触发了手指释放......

请查看您在侦听器中获得touches的TouchEventchangedTouches和targetTouches属性发生了什么。我强烈怀疑你会看到仍然有一个“手指”在触摸......所以它从 2 次触摸变为 1 次......

确保（不再）触摸的手指实际上是按钮等上的手指，这一切都比旧的mouseup和mousedown事件要简单得多。

编辑：我意识到您的问题出在 IE 上，它是指针事件……但是它们的工作原理基本相同，因为它们也支持多点触控（因此可能会遇到同样的问题）。我没有看到类似于 的属性touches，但我确实看到了pointerId，它可以为您提供相同的信息（以您的一些簿记为代价）。

这个 MSDN 页面有一些很好的信息。我认为尤其是这段代码片段很有启发性：

function pointerdownHandler(evt) {
      evt.target.setPointerCapture(evt.pointerId);
}

这似乎证实了，当手指碰到表面时，接触点会获得一个 ID，该 ID 用于在您收到pointerup事件时通知您哪根手指离开了表面。

我会添加一些只打印pointerIdonpointerdown的日志记录，pointerup我敢打赌你会很快找到你的解决方案。

于 2015-07-22T23:33:54.240 回答