elementByClassName上的JavaScript onclick事件

我有下面的标记，我试图运行一个JavaScript函数一旦点击。到目前为止，我还没有面临任何成功。 PLZ的帮助 -elementByClassName上的JavaScript onclick事件

<div class='color-bar'></div> 
<div class='color-bar'></div> 
<div class='color-bar'></div> 
<div class='color-bar'></div> 

var ColorBars = document.getElementsByClassName("color-bar"); 
var charts = $("#line-container").highcharts(); 
var series; 
var colorIndex = new Array(); 

for(var i = 0; i < ColorBars.length; i++){ 

    ColorBars[i].onclick = function(){ 
     hideColor(i); 
    } 
} 

function hideColor(index){ 
    var charts = $("#line-container").highcharts(); 

    var series = charts.series[index]; 

    if(series.visible){ 
     series.hide(); 
    } 
    else{ 
     series.show(); 
    } 
}

我遇到的问题是搞清楚哪个色条用户点击。它是第一个，第二个还是第三个？基于此，我需要触发hideColor函数。

非常感谢。最好的问候，jahid

来源

2016-02-12 jahid

你可以使用'hideColor（$（本）的.index（））;'而不是'hideColor（i）;'。有人已经发布了一个答案，试图指出，但删除它。无论如何，这应该有助于解决这个问题。 – Xufox

-1

你需要给你colorbars IDS：

<div class='color-bar' id="colorbar1"></div> 
<div class='color-bar' id="colorbar2">></div> 
<div class='color-bar' id="colorbar3">></div> 
<div class='color-bar' id="colorbar4">></div>

然后你可以检查：

ColorBars[i].id == X

来源

2016-02-12 14:22:19

elementByClassName上的JavaScript onclick事件

回答

相关问题