根据数据库中的值更改 td 单元格的颜色

Change color of the td cell based on the value in database

本文关键字：td 单元格 颜色 数据库      更新时间：2023-09-26

嗨，我正在开发一个 Django 驱动的网站。我有一个返回特定记录 ID 的 html 表。我的目标是根据值更改 td 单元格颜色。以下是我的网页

                   {% for l in all_items %}
                                <td style="text-align: center"
                                    id="{{m.id}}_{{m.set}}">
                                </td>
                    {% endfor %}

并使用JavaScript将值传递给id，如下所示：

<script>
$(document).ready(function() {
    {% for a in all_results %}
            $('#{{a.id}}_{{a.set}}').html('{{a.id}}');
    {% endfor %}
});
</script>

我的一个css(基于状态(：

.completed{
    background-color: #53A36E;
}

由于它是 html 中所有项目的 for 循环，因此每个项目都返回不同的值(ids 并且还有另一列未显示是状态(。td 单元格(包含 id(的颜色将根据状态而变化。我怎样才能实现它？提前感谢伙计们。

假设您的模型中有一个名为status字段的CharField，并且可以具有值"completed" ，您可以编写：

<td style="text-align: center"
    class="{{ m.status }}"
    id="{{ m.id }}_{{ m.set }}">
</td>

对于"completed" m.status的单元格，背景颜色将为#53A36E。

如果需要从 Javascript 设置类，可以使用以下内容：

{% for a in all_results %}
        $('#{{ a.id }}_{{ a.set }}').html('{{ a.id }}');
        $('#{{ a.id }}_{{ a.set }}').addClass('{{ a.status }}');
{% endfor %}
相关文章：