Fabric.js - 触摸事件传播答案

【问题标题】：Fabric.js - Touch Event PropagationFabric.js - 触摸事件传播
【发布时间】：2014-01-18 01:30:59
【问题描述】：

我有一个 HTML5 页面，它看起来像这样：

<html>
<head></head>

<body>
<canvas id="c1" width="500" height="500" />

</body>
</html>

我使用 Bootstrap 3 和 Fabric.js 作为画布库。当我在移动设备上运行它时，我遇到了一个问题，即当我触摸画布上的对象并移动它时，页面也会移动。似乎触摸事件也由移动设备浏览器处理。

我希望停止移动设备浏览器的默认事件句柄，因此当我触摸画布中的对象并移动它时，网页也不会移动。我怎样才能用 Fabric.js 做这个？

【问题讨论】：

标签： twitter-bootstrap-3 fabricjs

【解决方案1】：

我在制作html时改变了方式：

<meta name="viewport" content="width=device-width, initial-scale=0.5, user-scalable=no">

然后，为了防止浏览器默认缩放弹跳，我们可以在文档中绑定“touchmove”并禁用它。这来自 jQuery mobile，但 vmousemove = touchmove 以某种方式用于移动设备。

$(document).on("vmousemove", "body", function(e) {
                    e.stopPropagation();
                    e.preventDefault();
                    return false;
                });

无论如何，这与 Fabric.js 无关，因此我不必更改 Fabric.js 或其他内容。

【讨论】：