Question

我在iOS上使用Turbolinks 3.0和Fastclick删除了300毫秒的iOS延迟，并启用了转换缓存。这为移动设备上的Rails提供了非常好的/即时体验。

我在同一个地方的两个页面上都有一个链接，当我按下一个页面上的链接时，fastclick + turbolinks会立即加载下一页 - 但是该事件会传递到下一页并且该页面上的链接获得点击它，触发两个链接并两次导航页面。

事件实际上会传递到同一个地方的任何内容（如果我点击链接并且表单输入位于下一页加载的同一位置，它将关注输入）。

我实际上可以用手指“快速点击”以防止它发生。它只有当水龙头更缓慢（持续时间更长）才会发生。

非常感谢任何帮助或见解！

Answer 1

经过几天令人沮丧的调试和思考过去几天，这个解决方案似乎有效（但非常黑客）：

JS：

$(document).on("page:restore", function() {
  $("body").prepend("<div id='ghost-blocker' onclick='return false;'></div>");
  setTimeout(function() {
   $("#ghost-blocker").remove();
  }, 300);
});

CSS：

#ghost-blocker {
  position: absolute;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  z-index: 999;
}

我基本上使用警报调试了所有回调，并且看到从缓存加载页面之后但在鬼点击之前发生的最后一件事是页面：恢复功能。我制作了一个覆盖整个屏幕的拦截器div，取消了任何点击事件，然后在300毫秒后将其删除。尽管如此，这仍然可以完成这项任务。页面：恢复回调也是以任何其他方式重置页面的好时机，例如重置剩下的加载程序映像（我正在使用ladda）。

我现在要尝试更深入地尝试捕捉鬼点击事件并防止它发生而不是用整个div操纵DOM。如果有人对如何做到这一点有任何见解，我很乐意听到。

Turbolinks / Fastclick - 使用转换缓存时，触摸事件“传递”到下一页

1 个答案: