javascript - 将 if 语句变成循环

Question

我有 3 个图表需要重新绘制。

这是我必须做的代码：

var arrOfChartContainers = ["TopLeft","TopRight","BottomLeft"];


var myAutoRefresh = setInterval(function(){
    if($("#TopLeft_chartConfig").css("display")==="none"){
        drawChart("TopLeft");
    }else{
        clearInterval(myAutoRefresh);
    }
},3000);

我不想再复制 2 次并重新绘制我的另外两个图表。如果我想在一个间隔内同时做这三个，我该如何循环我的图表？

Answer 1

使用$.each：

$.each(arrOfChartContainers, function(index, entry) {
    $("#" + entry + "_chartConfig").doSomethingWithItHere();
});

例如：

$.each(arrOfChartContainers, function(index, entry) {
    var $chart = $("#" + entry + "_chartConfig");
    if ($chart.css("display") === "none") {
        drawChart(entry);
    }
});

可能值得更改drawChart为直接接受 jQuery 对象而不是间接使用名称。

Answer 2

HTML：为您的图表元素添加一个类以适应以下 js。

JS：

$('.someuniversalchartclass').each(function(){
   ($(this).hasClass('ninja')) ? drawChart($(this)) : clearInterval(myAutoRefresh);
});    

CSS：

.ninja {
   display:none;
}

Answer 3

您可以使用 for 循环。另外，您可以使用而不是检查 css.is(':visible')

for (var i = 0; i < arrOfChartContainers.length; i++) {
    if ($('#' + arrOfChartContainers[i] + '_chartConfig').is(':visible')) {
        drawChart(arrOfChartContainers[i]);
    }
}