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

Question

您好，我正在开发一个由 Django 支持的网站。我有一个 html 表，它返回特定记录的 ID。我的目标是根据值更改 td 单元格颜色。以下是我的html

                   {% 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)的颜色将根据状态发生变化。我怎样才能让它发生？提前谢谢大家。

Answer 1

假设您的模型中有一个名为 status 的 CharField 字段，并且它的值可以是 "completed"，您可以这样写:

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

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

如果您需要从 Javascript 设置类，您可以使用以下方法:

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