Javascript 如何根据Datatable中的单元格值更改行的背景色？

我有一个datatable，它有8列，其中一列是隐藏的。我想将“Durum”列值为“Aktif”的行的背景色更改为绿色，将列值“Pasif”更改为红色。我使用了“fnRowCallback”和“createdRow”功能，但我无法更改颜色。ı在下面添加了我的代码。我哪里做错了？请帮助我

管理员登录
$（文档）.ready（函数（）{
变量表=$（'#UserList'）。数据表({
“阿伦提努”：[[4,8,12，-1]，[4,8,12，“全部”]，
“iDisplayLength”：4，
“bFilter”：错误，
“aaSorting”：[[2，“desc”]，
“fnRowCallback”：函数（nRow、aData、iDisplayIndex、iDisplayIndexFull）{
如果（数据[5]=“Aktif”）{
$（'td'，nRow）.css（'background-color'，'Green'）；
}
else if（数据[5]=“Pasif”）{
$（'td'，nRow）.css（'background-color'，'Red'）；
}
},
选择：{
风格：“单身”
},
语言：{
url:“//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/Turkish.json”
}
});
});
$（文档）.ready（函数（）{
$（'#UserList tbody'）。在（'click'，'tr'，函数（）{
var tableData=$（this.children（“td”）.map（函数（）{
返回$（this.text（）；
}).get（）；
//警报（“您的数据是：“+$.trim（tableData[0]）+”、“+$.trim（tableData[1]）+”、“+$.trim（tableData[2]）”；
$（'Hidden1'）.val（tableData）；
});
});
梅哈巴链接按钮
注销
库兰·乔克拉尔
库兰·李斯特
身份证件
库兰·卡德
公元
索亚德
伊萨明
硬粒
拉波尔·格斯特
Sil

然后您可以尝试createdCell

"createdCell": function (td, cellData, rowData, row, col) {
  if ( cellData == "Aktif" ) {
    $(row).css('background-color', 'Green');
  }
  else if (cellData == "Pasif") {
    $(row).css('background-color', 'Red');
  }

---

将

fRowCallback

函数更改如下：

"rowCallback": function( row, data, index ) {
      $node = this.api().row(row).nodes().to$();

  if (data[5] == "Aktif") {
     $node.addClass('green')
  }
}  

CSS:

.green{
  background-color: green!important;
}

---

尝试添加此函数

<style type="text/css">
    .clrGreen{
        background-color:green;
    }
    .clrRed{
        background-color:red;
    }
</style>
<script type="text/javascript">
    $(document).ready(function () {
        $('#UserList > tbody  > tr').each(function () {
            debugger;
            var durumValue = $(this).find(".lblDurum").html();
            switch (durumValue) {
                case "Aktif":
                    $(this).addClass("clrGreen");
                    break;
                case "Pasif":
                    $(this).addClass("clrRed");
                    break;
            };
            });
    })
</script>

格林先生{
背景颜色：绿色；
}
克莱德先生{
背景色：红色；
}
$（文档）.ready（函数（）{
$（'#UserList>tbody>tr'）。每个（函数（）{
调试器；
var durumValue=$（this.find（“.lblDurum”）.html（）；
开关（durumValue）{
案例“Aktif”：
$（this.addClass（“clrGreen”）；
打破
案例“Pasif”：
$（此）.addClass（“clrRed”）；
打破
};
});
})

---

她是解决您问题的最简单的解决方案，不需要jquery/javascript

<asp:Repeater ID="rptUsers" runat="server">
        <HeaderTemplate>
            <table class="table table-striped table-bordered table-hover" id="UserList">
                <thead>
                    <tr>
                        <th class="hidden">ID</th>
                        <th style="text-align: center">Kullanıcı Adı</th>
                        <th style="text-align: center">Ad</th>
                        <th style="text-align: center">Soyad</th>
                        <th style="text-align: center">IsAdmin</th>
                        <th style="text-align: center">Durum</th>
                        <th style="text-align: center">Rapor Göster</th>
                        <th style="text-align: center">Sil</th>
                    </tr>
                </thead>
                <tbody>
        </HeaderTemplate>
        <ItemTemplate>
            <tr class="<%# Eval("Durum") %>">
                <td class="hidden">
                    <asp:Label ID="lblSira" runat="server" Text='<%# Eval("ID") %>' />
                </td>
                <td style="pointer-events: none; text-align: center">
                    <asp:Label ID="lblKullaniciAdi" runat="server" Text='<%# Eval("KullaniciAdi") %>' />
                </td>
                <td style="pointer-events: none; text-align: center">
                    <asp:Label ID="lblAd" runat="server" Text='<%# Eval("Ad") %>' />
                </td>
                <td style="pointer-events: none; text-align: center">
                    <asp:Label ID="lblSoyad" runat="server" Text='<%# Eval("Soyad") %>' />
                </td>
                <td style="pointer-events: none; text-align: center">
                    <asp:Label ID="lblAdmin" runat="server" Text='<%# Eval("IsAdmin") %>' />
                </td>
                <td style="pointer-events: none; text-align: center">
                    <asp:Label ID="lblDurum" runat="server" Text='<%# Eval("Durum") %>' />
                </td>
                <td>
                    <asp:Button ID="btn_Show" class="btn btn-primary center-block" OnClick="btn_Show_Click" runat="server" Text="Göster" />
                </td>
                <td>
                    <asp:Button ID="btn_Delete" class="btn btn-danger center-block" OnClick="btn_Delete_Click" runat="server" Text="Sil" />
                </td>
            </tr>
        </ItemTemplate>
        <FooterTemplate>
            </tbody> </table>
        </FooterTemplate>
    </asp:Repeater>

---

尝试添加调试代码-添加console.log（数据[5]）并检查得到的是哪个值？值为“Aktif”确定，您得到了值，但颜色没有改变。。。通过查看inspect元素，检查是否在td上应用了CSS类“green”？也许它会被其他类覆盖…为什么不在repeater上使用OnItemDataBound？我如何使用它，你能给我一个例子吗@ZP Balochi已经添加了一个jquery函数，如果它不起作用，我将向您发送服务器端函数。@ZPBaloch很抱歉，该函数不起作用，答案已更新，第二种方法已添加为其他答案尝试使用类作为标签而不是id，因为id是唯一的。答案更新

.Aktif{ background-color: green;}
.Pasif{ background-color: red;}