14

我在执行 jqPlot 项目上的操作点击时遇到了一些问题，我希望其他人能对出了什么问题有所了解。

我有一个用 jqPlot 呈现的条形图，它使用以下代码将点击事件处理程序附加到（在 jqPlot 图表上）：

$.jqplot.eventListenerHooks.push(['jqplotClick', myClickHandler]);

myClickHandler 看起来像这样：

function myClickHandler(ev, gridpos, datapos, neighbor, plot) {
  alert('you have triggered click action');
}

我的意图是通过使用这个简单的 jqPlot 实现，当单击图表内的区域（包括条形图项）时，将触发警报操作。这在任何桌面浏览器（IE6/7/8/9、Chrome、Safari）中都能完美运行。

但是，我遇到的问题是，当我使用 iPhone/iPad 访问该站点时，除了上面指定的单击操作行为异常之外，一切都完美呈现。

如果我尝试触摸任何条形图项目，它不会提醒“您已触发点击操作” -就好像什么都没发生一样。

但是，当我尝试单击（触摸）图表的空白区域时，警报消息会正常触发。

有任何想法吗？

4

3 回答 3

1 
$.jqplot.eventListenerHooks.push(['jqplotClick', myClickHandler]);

此调用会将 onClick 处理程序附加到整个事件画布。（此事件画布具有绘图的大小，应该高于所有其他画布才能工作 - 这意味着您可能需要手动修改它的 z-index 才能使事情正常工作）。我认为你的情况是这样的：

  1. 您正在将“myClickHandler”方法附加到事件画布。每次单击事件画布时都会触发它，无论在哪里 - 在系列或情节的背景上。

  2. 在使用条形图渲染器的情况下，此事件画布位于系列画布下方（要么在系列画布之前创建，要么具有较低的 z-index）。解决方案是在创建图表后手动增加事件画布的 z-index。在此之后，它将位于顶部，并且单击事件将被正确处理。

  3. 请记住，无论在何处，每次单击该图时都会触发此单击事件。解决方案是过滤“myClickHandler”方法的执行，如下所示：

代码：

function myClickHandler(ev, gridpos, datapos, neighbor, plot) {
    if (isClickEventOverTheSeries(gridpos)) {
        alert('you have triggered click action');
    }
}

在此示例中， gridpos是包含 2 个点的数组 - 单击事件的 x 和 y 坐标。“ isClickEventOverTheSeries ”方法是检查在该坐标下是否绘制了系列的函数。我不确定如何使用 BarChart 渲染器来实现这一点 - 我从未使用过它，但是使用线条渲染有一种方法可以检查它......

希望这可以帮助

于 2012-12-17T16:26:24.720 回答
0

我不知道 jqplot，但一般来说，在触摸设备上还有更多的中间事件mousedown和事件。click在click事件本身最终触发之前“失去”点击的可能性更大。mousedown，或者在您的情况下为“jqplotMouseDown”，对您来说可能是一个更好的选择。

于 2012-03-20T23:31:39.163 回答
0

您应该能够通过完全按照@PriorityMark 的建议来解决这个问题，即通过明确z-index设置jqplot-event-canvas.

例如，在这个问题具有相似性质的答案中显示了它可能完成的方式。在我最初的更改之后，即发送jqplot-overlayCanvas-canvas后面jqplot-series-canvas我忘了把jqplot-event-canvas前面。

于 2012-05-24T16:16:32.497 回答