Turbolinks / Fastclick-使用过渡缓存时，触摸事件“通过”到下一页

Question

我在具有Fastclick的iOS上使用Turbolinks 3.0，以消除300ms的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;
}

我基本上用警报调试了所有回调，并看到从缓存加载页面之后但在幻影点击触发之前发生的最后一件事是page：restore函数。 我制作了一个阻止器div，它覆盖了整个屏幕并取消了所有点击事件，然后在300毫秒后将其删除。 尽管草率地完成了这项工作。 page：restore回调也是以所需的其他任何方式重置页面的好时机，例如重置剩余的加载程序映像（我使用的是ladda）。

我现在将尝试更深入地研究并尝试捕获虚假单击事件并防止其发生，而不是使用整个div操作DOM。 如果有人对如何执行此操作有任何见解，我很想听听。