javascript - 如何在鼠标单击时显示来自不同 div 的不同文本？

Question

如何在鼠标单击时显示来自不同 div 的不同文本？
因此，对于饼图的每次点击，它都应该显示来自 div 的不同文本。
我怎样才能做到这一点？

这是代码： http: //jsfiddle.net/r6p7E/19/
但我想要这样的东西：http: //jsfiddle.net/hari_shanx/2ehdW/

click: function(event) {
    if(event.point.selected) {
        $("#content").hide();
    }else {
        $("#content").show();
        $("#content").html(event.point.name)
    }
}

Answer 1

据我了解，您需要实现一种地图来将选定的图表数据转换为正确的 div id 并获取此 div 的内部文本。

我不知道你有什么 div，例如：http: //jsfiddle.net/r6p7E/21/

click: function(event) {
  alert($('#data'+event.point.name).html());
  $('#testDiv').show();
}

在这种情况下，地图被处理为'#data'+event.point.name

但是您可以将 js 哈希表用于复杂的地图。

Answer 2

传递给 click 的事件包含 event.point ，其中包含属性名称和 y ，它可以为您提供在http://jsfiddle.net/hari_shanx/2ehdW/中单击时显示的数据

设置 div 以显示浏览器名称的示例：

click: function(event) {
    $('#testDiv').show().text(event.point.name);
}

http://jsfiddle.net/qXTbr/

对于您的代码，我相信您会想要：

click: function(event) {
    if(!event.point.selected) {
        $("#content").hide();
    }else {
        $("#content").show();
        $("#content").html(event.point.name)
    }
}

因为您希望数据在未选择时而不是在选择时隐藏