javascript - interact.js 1.2.4 拖动和手势 Action 混淆

标签 javascript ipad backbone.js mobile-safari interact.js

我有 interact.js 1.2.4 和 iPad Retina iOS 8.1 Mobile Safari 的问题,我需要以某种方式解决。问题出现在嵌套在大型顺序学习 Web 应用程序中的排序组件中,用户在其中解决一系列任务。 interact.js 插件用于添加拖放行为,以便用户可以按正确顺序对元素进行排序。该站点已上线,但我要描述的问题现在是持久性的且可重现的,因此需要快速解决。

这是设置。我们用

初始化了许多可拖动元素
interact('.drag').draggable(...);

并且我们已经注册了 onstart、onmove 和 onend 监听器,这些监听器是通过回调函数手动处理的。

在大多数情况下,拖放行为会按计划进行。但是当在应用程序序列的某些部分使用排序组件时,交互的 actionName 莫名其妙地是“手势”而不是“拖动”,这使得 validateAction (interact.js) 函数返回 null 而不是有效操作。这反过来又会导致 pointerDown (interact.js) 处理程序永远不会被触发,因此拖动 Action 永远不会启动,并且元素永远保持不动,从而无法在序列中进一步前进。该行为仅发生在 iPad 上。 如果我在 iPad 模拟器中运行该站点并使用 Safari 的开发人员工具十字准线功能检查该元素,则元素发生了一些变化,并且下一个交互的 actionName 突然变为“拖动”,因此该组件开始按预期工作并且用户可以继续顺序。

你有什么想法:

  1. 是什么导致网站传递“手势” Action 而不是“拖动” Action ?
  2. 当我使用检查十字准线时到底发生了什么?为什么它会改变行为?
  3. 我该如何解决这个问题?

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

提前致谢。

最佳答案

我们仍然不知道原因,但似乎 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]);
  }
})

关于javascript - interact.js 1.2.4 拖动和手势 Action 混淆,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33033089/

相关文章:

iphone - 由于 iphone 自动锁定导致应用程序崩溃?

iphone - 屏蔽 UIView 的特定 subview ?

javascript - 使用 jquery 创建基于 JSON 的动态 SelectBox

javascript - 单击更改 li 类

javascript - 在 node.js 中扩展类的不同方式

iphone - 如何像 UIScrollView 一样取消触摸?

javascript - 主干 : how to pass data to a render view

javascript - 如何传递查询参数而不将其显示在浏览器中

javascript - Backbone/Require 应用程序中带有 subview 的 View 中的渲染问题

javascript - JSZip 文件无法工作 :"' 错误 : The data of 'the loaded zip file' is in an unsupported format ! "