根据输入字段的值更改文本颜色或背景
根据输入字段的值更改文本颜色或背景
提问于 2012-12-05 16:24:07
我有这个javascript函数，它工作得很好，但我想添加到它中。
风险是通过将严重程度乘以可能性来计算的。计算由validate_form()下面的函数完成
按价值计算的颜色是：
- 绿色-小于6的输入字段将颜色改为绿色。
- 橙色-6-9岁之间
- 红色-如果超过9
风险值写入并输入名为"risk1“"risk2”等字段。
function validate_form ( ) {
valid = true;
document.calc.risk1.value = document.getElementById('data_1_severity').value*document.getElementById('data_1_likelihood').value;
document.calc.risk2.value = document.getElementById('data_2_severity').value*document.getElementById('data_2_likelihood').value;
return valid;
}有人能帮我吗？只是想要风险评分改变颜色取决于价值或背景的细胞改变颜色-没有真正的烦恼。这将表明，如果风险是：
- 绿色-低风险
- 橙色-中度风险
- 红-高风险。
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-12-05 16:41:27
就像这样：
var changeColor = function(obj){
if(obj.value < 6){
obj.style.backgroundColor = 'green';
} else if(obj.value >= 6 && obj.value <= 9){
obj.style.backgroundColor = 'orange';
} else if(obj.value > 9){
obj.style.backgroundColor = 'red';
}
};然后在validate_form()函数中：
changeColor(document.calc.risk1);更好的做法是为每种颜色创建CSS类，并执行如下操作：
obj.className = 'green';而不是
obj.style.backgroundColor = 'green';Stack Overflow用户
发布于 2012-12-05 16:38:40
您可以使用jQuery来完成这个任务。
您的CSS应该如下所示：
.low-risk{
background: green;
}
.medium-risk{
background: orange;
}
.high-risk{
background: red;
}下面是一个用于更改颜色的javascript函数：
<script>
function changeInputColor(input, value){
$(input).removeClass();
if (value < 6){
$(input).addClass('low-risk');
}
else if(value >= 6 && value <= 9){
$(input).addClass('medium-risk');
}
else{
$(input).addClass('high-risk');
}
}
</script>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13727735
复制相关文章
相似问题
腾讯云开发者
