我的django應用程式根據python dictionary“參與者”生成一個表格。為此,它使用HTML下面的代碼,該代碼具有一個貫穿所有*elements*“參與者”的回圈。該表生成沒有任何問題。
現在我想有條件地更改值為“balance”的列的背景顏色,具體取決于該值是 > 0、< 0 還是 = 0。為此,我javascript在HTML body. 但這沒有任何效果。如何修復代碼?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Participants</title>
</head>
<body>
<h1>Participants</h1>
<table id="participants_table" border="1">
{% for x in participants %}
<tr>
<td>{{ x.firstName }}</td>
<td>{{ x.lastName }}</td>
<td class="balance">{{ x.balance }}</td>
</tr>
{% endfor %}
</table>
<script>
var balance = document.getElementById('participants_table').getElementsByClassName('balance');
if (balance.innerHTML > 0){
balance.style.backgroundColor='#003F87';
} else if (balance.innerHTML < 0) {
balance.style.backgroundColor='#0033H7';
} else {
balance.style.backgroundColor='#0093H7';
}
</script>
</body>
</html>
uj5u.com熱心網友回復:
理論上這應該有效。
<td style=background-color: "{% if x.balance > 0 %}#003F87{% elif
x.balance < 0 %}#0033H7 {%else%)#0093H7{% endif %}">{{ x.balance
}}</td>
所以我使用行內樣式(不推薦)并有條件地渲染 bg 顏色。如果您使用的是 Bootstrap 之類的東西,那么它可能會像這樣更干凈:
<td hljs-meta prompt_"> %}bg-warning{%else%)bg-secondary{% endif %}>{{ x.balance }}</td>
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/520411.html
上一篇:更改文本懸停時選單的顏色
下一篇:讓html分隔符回應像素大小
