如何根据数据表中的值更改单元格<td>颜色

Question

我想根据数据表中的值更改单元格颜色。我已经尝试过此代码，但无法正常工作。以下是示例代码和数据表。任何想法和帮助深表感谢。

$(document).ready(function() {
    var data = {"alfaromeo":["mito","156","147","giulietta","159","166","146"],"audi":["a3","a4","a6","a5","80","a1","q3","a8","q5"],"bmw":["320","116","x3","316","318","118","530","x1","520","x5","525","330","120","323","serija 1"],"chevrolet":["spark","lacetti","captiva","aveo","cruze"],"citroen":["c4","c4 grand picasso","c3","c5","c4 picasso","xsara","berlingo","c2","xsara picasso","saxo","ds5","c1"],"fiat":["brava","bravo","panda","grande punto","stilo","punto","punto evo","doblo","500","tipo","uno","coupe"],"ford":["c-max","fiesta","focus","mondeo","fusion","ka","escort"],"honda":["civic","accord","cr-v"],"hyundai":["getz","i10","i20","atos","i30","coupe","elantra","accent","santa fe","ix35","tucson"],"kia":["rio","pro_cee'd","sportage","cee'd","pride","sorento"],"mazda":["3","2","323 f","626","6","cx-5","323","premacy","5"],"mercedes":["a-klasa","c-klasa","e-klasa","b-klasa","124"],"mercedes-benz":["e-klasa","clk-klasa","c-klasa","s-klasa","190","a-klasa","b-klasa","c t-model","ml-klasa","w 124","124"],"nissan":["qashqai","x-trail","note","primera","micra","juke","almera"],"opel":["corsa","astra","zafira","meriva","vectra","insignia","mokka","tigra","combo","astra gtc","kadett"],"peugeot":["308","207","206","306","106","307","208","406","508","407","partner","3008","405"],"renault":["thalia","clio","scenic","grand scenic","kangoo","captur","megane grandtour","megane","laguna","5","megane break","twingo","modus","kadjar","megane classic","espace","megane scenic","megane coupe","megane sedan"],"seat":["toledo","leon","ibiza","altea","cordoba"],"skoda":["fabia","octavia","120","superb","felicia","rapid"],"smart":["fortwo"],"toyota":["corolla","yaris","auris","avensis","rav 4","land cruiser"],"vw":["polo","golf v","golf iv","golf vii","passat","golf vi","jetta","passat variant","caddy","sharan","tiguan","golf variant","golf ii","vento","golfplus","golf iii","bora","touran","touareg","up!"]};
    var firstSelect = $('<select id="firstSelect"></select>');
    var secondSelect = $('<select id="secondSelect"> </select>');
    $.each(data, function(item, key) {
        firstSelect.append('<option >' + item + '</option>');
    });
    $("#container").html(firstSelect);
    $("#firstSelect").on("change", function(e) {
        var item;
        var selected = $(this).val();
        if (selected === "alfaromeo") {
            item = data[selected];
        } else {
            item = data[selected];
        }
        $(secondSelect).html('');
        $.each(item, function(item, key) {
            secondSelect.append('<option >' + key + '</option>');
        });
    });

    $("#container").append(secondSelect);


});

<script type="text/javascript">
var oTable = $('table').DaTable({ 
'rowCallback': function(row, data, index){
    if(data[6]=='Cleared')
    {
    $(row).find('td:eq(6)').css('color', 'green');
    }
    else
    {
      $(row).find('td:eq(6)'.css('color', 'red');
    }
  }
});

Answer 1

实时链接https://dotnetfiddle.net/rdL6IU

您可以在@ https://datatables.net/examples/basic_init/zero_configuration.html @

上执行此操作

   $(function () {
        $('#example').dataTable({
            "createdRow": function (row, data, dataIndex) {
                if (data[0] == 'Garrett Winters') {
                    $(row).addClass('redClass');
                }
            }
        });
    })