如何避免在jQuery中使用以下代码中的if else循环

时间:2018-03-20 12:06:15

标签: jquery css if-statement sharepoint switch-statement

有人可以帮助您删除重复的代码。

我有四个仪表板作为样本我在这里提到了两个。

对于所有仪表板,同样的逻辑适用但是当我尝试使用css类根据条件应用css时它不起作用。

所以,我使用过id,它运行正常。

但是我必须重复并写四次相同的条件。这使得48以及其他一点都没有好处继续下去。请帮忙。

if(dashboard1!=null)
    {
    var status1 =$('#div-dashboard1. dashboard-table tbody tr:nth-child(2) td:nth-child(1)').text();
        var status2 =$('#div-dashboard1. dashboard-table tbody tr:nth-child(2) td:nth-child(2)').text();
        var status3 =$('#div-dashboard1. dashboard-table tbody tr:nth-child(4) td:nth-child(1)').text();
        var status4 =$('#div-dashboard1. dashboard-table tbody tr:nth-child(4) td:nth-child(2)').text();
        if(status1 ==minCount)
        {
            $('#div-dashboard1. dashboard-table tbody tr td #hlStatus1').addClass("div-circle-green1");
        }
        else if ((status1 > minCount) && (status1 <=avgCount))
        {
        $('#div-dashboard1. dashboard-table td #hlStatus1').addClass("div-circle-amber");       
        }
        else if (status1 >avgCount)
        {
        $('#div-dashboard1 .dashboard-table td #hlStatus1').addClass("div-circle_red1");
        }
        if(status2==minCount)
        {
            $('#div-dashboard1 .dashboard-table td #hlStatus2').addClass("div-circle-green1");
        }
        else if ((status2> minCount) && (status2<=avgCount))
        {
            $('#div-dashboard1.dashboard-table td #hlStatus2').addClass("div-circle-amber");        
        }
        else if (status2>avgCount)
        {
        $('#div-dashboard1.dashboard-table td #hlStatus2').addClass("div-circle_red1");
        }

if(status3==minCount)
        {
            $('#div-dashboard1 .dashboard-table tbody tr td #hlStatus3).addClass("div-circle-green1");
        }
        else if ((status3> minCount) && (status3<=avgCount))
        {
            $('#div-dashboard1 .dashboard-table tbody tr td #hlStatus3).addClass("div-circle-amber");       
        }
        else if (status3>avgCount)
        {
        $('#div-dashboard1 .dashboard-table td #hlStatus3').addClass("div-circle_red1");
        }

if(status4==minCount)
        {
            $('#div-dashboard1 .dashboard-table td #hlStatus4').addClass("div-circle-green1");
        }
        else if ((status4> minCount) && (status4<=avgCount))
        {
            $('#div-dashboard1 .dashboard-table td #hlStatus4').addClass("div-circle-amber");       
        }
        else if (status4>avgCount)
        {
        $('#div-dashboard1 .dashboard-table td #hlStatus4').addClass("div-circle_red1");
        }

    }
    if(dashboard2!=null)
    {
    var status1=$('#div-dashboard2 .dashboard-table tbody tr:nth-child(2) td:nth-child(1)').text();
        var status2=$('#div-dashboard2 .dashboard-table tbody tr:nth-child(2) td:nth-child(2)').text();
        var status3=$('#div-dashboard2 .dashboard-table tbody tr:nth-child(4) td:nth-child(1)').text();
        var status4=$('#div-dashboard2 .dashboard-table tbody tr:nth-child(4) td:nth-child(2)').text();
                if(status1 ==minCount)
        {
            $('#div-dashboard2 .dashboard-table td #hlStatus1').addClass("div-circle-green1");
        }
        else if ((status1 > minCount) && (status1 <=avgCount))
        {
            $('#div-dashboard2 .dashboard-table td #hlStatus1').addClass("div-circle-amber");       
        }
        else if (status1 >avgCount)
        {
        $('#div-dashboard2 .dashboard-table td #hlStatus1').addClass("div-circle_red1");
        }
        if(status2==minCount)
        {
            $('#div-dashboard2 .dashboard-table td #hlStatus2').addClass("div-circle-green1");
        }
        else if ((status2> minCount) && (status2<=avgCount))
        {
            $('#div-dashboard2 .dashboard-table td #hlStatus2').addClass("div-circle-amber");       
        }
        else if (status2>avgCount)
        {
        $('#div-dashboard2 .dashboard-table td #hlStatus2').addClass("div-circle_red1");
        }

if(status3==minCount)
        {
            $('#div-dashboard2 .dashboard-table td #hlStatus3').addClass("div-circle-green1");
        }
        else if ((status3> minCount) && (status3<=avgCount))
        {
            $('#div-dashboard2 .dashboard-table td #hlStatus3').addClass("div-circle-amber");       
        }
        else if (status3>avgCount)
        {
        $('#div-dashboard2 .dashboard-table td #hlStatus3').addClass("div-circle_red1");
        }

if(status4==minCount)
        {
            $('#div-dashboard2 .dashboard-table td #hlStatus4').addClass("div-circle-green1");
        }
        else if ((status4> minCount) && (status4<=avgCount))
        {
            $('#div-dashboard2 .dashboard-table td #hlStatus4').addClass("div-circle-amber");       
        }
        else if (status4>avgCount)
        {
        $('#div-dashboard2 .dashboard-table td #hlStatus4').addClass("div-circle_red1");
        }
    }

2 个答案:

答案 0 :(得分:0)

var dashboard = Array("#div-dashboard1","#div-dashboard2","#div-dashboard3", "#div-dashboard4");
var i;

for (i=0; i<dashboard.length; i++)
{
  if(dashboard[i]!=null)
  {
    var status1 =$(dashboard[i] + ' dashboard-table tbody tr:nth-child(2) td:nth-child(1)').text();
    var status2 =$(dashboard[i] + ' dashboard-table tbody tr:nth-child(2) td:nth-child(2)').text();
    var status3 =$(dashboard[i] + ' dashboard-table tbody tr:nth-child(4) td:nth-child(1)').text();
    var status4 =$(dashboard[i] + ' dashboard-table tbody tr:nth-child(4) td:nth-child(2)').text();
  }
}

希望你现在能得到一个想法..只写一次你的代码的其余部分

答案 1 :(得分:0)

<!-- https://mvnrepository.com/artifact/org.apache.spark/spark-streaming-kafka-0-10 -->
<dependency>
    <groupId>org.apache.spark</groupId>
    <artifactId>spark-streaming-kafka-0-10_2.10</artifactId>
    <version>2.0.0</version>
</dependency>