Javascript 使jQuery Peity条形图条形图可单击

有没有一种方法可以使jQuery的条形图可以点击

我已经创建了一个2条形图，希望每个条形图都指向不同的链接

我能想到的最基本的方法是不起作用：

'>0'>0

我正在初始化条形图，如下所示：

// set up the graph
jQuery(".preprodbar").peity("bar", {
      fill: ["#e71d32", "#FDD600", "#5AAAFA"]
})

任何帮助都将不胜感激

您始终可以使用将单击事件绑定到任何元素来执行任何操作

$(document).ready(function(){
    $(document).on('click',''#leftBar',function(){
         // do something
         window.location.href = 'http://www.mylink.com';
    });

    $(document).on('click',''#rightBar',function(){
         // do something
         window.location.href = 'http://www.mylink.com';
    });
});

我不知道该图是如何构造其html的，但如果每个条都是.premodbar类的直接子项，则始终可以使用：nth childn选择器：

$(document).ready(function(){
    $(document).on('click','.prepodbar :nth-child(1)',function(){
         // do something on the first child
         window.location.href = 'http://www.mylink.com';
    });

    $(document).on('click','.prepodbar :nth-child(2)',function(){
         // do something on the second child
         window.location.href = 'http://www.mylink.com';
    });
}); 

对于注释中提到的画布元素选择：

$(document).on('click','canvas:eq(0)' ,function(){
     // do something
     $(this).css('background-color','#f00')
});

这将选择您创建的第一个。更改：eq0中的数字以选择任何其他，索引基于0。如果要将事件绑定到所有画布元素，只需从选择器中删除：eq0子字符串

---

Fiddle:

我的东西是：jQuerydocument.on'click'，premodcrashesbar，function{window.location.href=；}；但它仍然不起作用。你能提供你的html吗？将其粘贴到或类似的服务中是！所以我在这里放了一些代码：。在JavaScript部分，大部分是提供的jQuery Peity插件代码。一直滚动到底部，直到看到“我的代码从这里开始”注释。非常感谢你的帮助！我看到您正在使用的图形插件创建了一个元素，它几乎是一个单独的图形。使其可点击并不困难，但问题在于，根据单击图像的哪个区域，您需要不同的链接。很抱歉，我对canvas的了解还不足以帮助您。试着阅读一些关于画布的在线文章，或者发布一个关于画布元素中链接的新问题。不过，我该如何让整个东西都可以点击呢？