Question

我遇到了interactive.js 1.2.4和iPad Retina iOS 8.1 Mobile Safari的问题，我需要以某种方式解决这个问题。问题发生在嵌套在大型顺序学习Web应用程序中的排序组件中，用户在该应用程序中解决了一系列任务。 interact.js插件用于添加拖放行为，因此用户可以按正确的顺序对元素进行排序。该网站已上线，但我即将描述的问题现在已经持续且可重现，因此需要快速解决。

这是设置。我们用

初始化了许多可拖动的元素

interact('.drag').draggable(...);

我们已经注册了onstart，onmove和onend listeners，这些都是使用回调函数手动处理的。

在大多数情况下，拖放行为按计划行事。但是当在应用程序序列的某些部分中使用排序组件时，交互的actionName是令人费解的＆＃34; gesture＆＃34;而不是＆＃34; drag＆＃34;，这使得validateAction（interact.js）函数返回null而不是有效的操作。这反过来导致pointerDown（interact.js）处理程序永远不会被触发，因此永远不会启动拖动动作，并且该元素永远保持不变，使得无法在序列中进一步前进。该行为仅发生在iPad上。如果我在iPad模拟器中运行该站点并使用Safari的开发人员工具十字准线功能检查该元素，则会更改元素，并且下一个交互的actionName会突然变为＆＃34;拖动＆＃34;，所以组件开始按预期工作，用户可以按顺序进行。

你有任何想法：

是什么原因导致网站转发＆＃34;手势＆＃34;行动而不是＆＃34;拖动＆＃34;动作？
使用检查十字准线时会发生什么事？为什么会改变行为？
如何解决此问题？

您可以看到组件代码here，但它是主要Backbone解决方案的一部分，所以这就是我可以包含的内容。

提前致谢。

Answer 1

我们仍然不知道原因，但似乎iOS中存在一个错误，导致应用程序一次触发5个指针事件。因此，插件将事件注册为手势，拖放功能失败。插件创建者给出了这个建议，解决了这个问题：

interact(document).on('down', function (event) {
  var interaction = event.interaction;
  var canGesture = interaction.target && interaction.target.options.gesture.enabled;
  var maxAllowedPointers = canGesture? 2 : 1;

  while (interaction.pointers.length > maxAllowedPointers) {
      interaction.removePointer(interaction.pointers[0]);
  }
})

interact.js 1.2.4拖动和手势动作混乱

1 个答案: