iPad上表格单元格的“点击”事件精度问题

Question

iPad上表格单元格的“点击”事件精度问题

javascriptipaddatatables

3

TL;DR: “click”监听器对表格单元格（td）和表头（th）不准确，在使用iPad 2的移动Safari浏览器时，点击似乎超出了单元格的边界。这是否是已知问题，有没有解决方法？

这是一个相当具体的问题，并且没有示例代码（也不需要）。希望有人能找到这个问题并在此之前解决它！

我有一个使用DataTables.net和jQuery UI构建的表格。虽然这应该是无关紧要的，但我仍想提一下。该表格在许多不同的元素上侦听点击事件（我认为移动Safari只将其转换为轻拍），包括行标头（用于排序）和某些单元格内容。

在Mac上使用Inspector（与iPad连接）后，我可以清楚地看到在填充、边框、边距甚至是“visibility:hidden”等方面都没有意外重叠的元素。此外，它们是默认行为的表格单元格；不是表格单元格的模拟。

在实际数据的顶行中，如果我在单元格的上半部分任何位置轻点一下，它实际上会触发行标头的点击事件。我将缩放设置到荒谬的级别，以确保我不会不小心碰到标头，并且我已经确认轻点完全发生在表格单元格内，而不是上面的标头。

是否有人知道是否有一种meta属性或某些CSS甚至JavaScript解决方案来解决这种不准确性？至少有一半的时间，我轻点单元格时实际上触发了列排序（来自幽灵标头轻点）。

我唯一能想到的解决方法是在每个单元格的内容中包含一个div或span，将它们从单元格边缘处略微分离，并希望以此人为地减少轻点目标区域。

- Greg Pettit

这似乎是跨移动平台普遍存在的问题（不仅仅是表格）。过去，我通过监听本机触摸事件（例如 ontouchstart、ontouchend）来解决这个问题，或者使用类似 jQuery Mobile 的库，并使用 tap() 而不是 click() 绑定事件处理程序。 - quietmint

谢谢。我听说jQuery Mobile和jQuery UI之间存在冲突，所以我不想走这条路。看看这里的答案：https://dev59.com/fm445IYBdhLWcg3wpb8P，看看是否有帮助。 - Greg Pettit

列标题和单元格监听器是否同时触发？如果它们都被触发，也许执行一个检查，判断点击位置是否在元素内会起作用。 - Nathan Breit

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- erikvold · Answer 1

如果x，y坐标在表格之外，那么您不能简单地忽略它吗？

如果单击在表格内，但是x，y坐标错误，则可能是缩放问题或错误。