Question

我试图找出我的点击是否在特定的Highcharts图表上。我不能在图表上使用click事件，因为该区域位于标题中，而不是图表本身，而Highcharts不支持绘制区域之外的任何点击事件。

$(document).mouseup(function(event) {
    var clickedElement = event.target;
    if (clickedElement == "chart_1")
        console.log('yes');
    console.log(clickedElement);
});

我将event.target保存在变量中;然后我想检查一下我点击的是一个特定的图表（我在同一页面上有多个图表，每个图表在其div中）。

这是我获得的console.log的输出;当我点击Highchart时：

<rect x="0" y="0" width="880" height="150" strokeWidth="0" rx="15" ry="15" fill="url(#highcharts-2)" class=" highcharts-background"></rect>

我想检查填充并查看我点击的图表，然后触发事件。

我尝试使用字符串搜索，但它失败了，因为从event.target返回的对象是一个DOM（根据我的理解，我刚开始这个）;那么如何访问变量中的值并进行比较，以便我可以为类或填充查找特定值？

编辑：

感谢Adeneo！有效的解决方案是使用.getAttribute的解决方案。当我点击填充“url（#heighcharts-2）”中的图表时，这将返回“是”

$(document).mouseup(function(event) {
    var clickedElement = event.target;
    if (clickedElement.getAttribute('fill') == "url(#highcharts-2)")
        console.log('yes');
});

当我尝试它们时，所有其他的都不起作用，比较总会失败;这是唯一有效的。再次感谢

Answer 1

将其包装在jQuery中并使用prop（）获取属性：

$(clickedElement).prop("fill")

Answer 2

如果您正在使用jquery版本＆lt; jQuery 1.6，使用

$(clickedElement).attr("fill")

其他明智的jQuery版本＆gt; jQuery 1.6使用

$(clickedElement).prop("fill")

Answer 3

您可以使用getAttribute

clickedElement.getAttribute('fill')

如何从event.target获取DOM属性，以便我可以比较它们？

3 个答案: