怎么将表格中得某一行中得字体动态得显示颜色
日期：2014-05-17 浏览次数：20785 次
如何将表格中得某一行中得字体动态得显示颜色?
当表格中某一行中得数据满足某个条件后,我想让它得字体颜色也改变,比如说变成红色.
原先得语句是: <td > <c:out value= "${item.valueN} "/> </td>
当表格中该行得数据被我编辑改变以后,我想让它得颜色也相应改变.请问这个怎么写啊?请高手赐教!
------解决方案--------------------
条件写出来，加上 <td style= "color:red "> <c:out value= "${item.valueN} "/> </td>
------解决方案--------------------
定义两个class，通过事件动态修改class
------解决方案--------------------
通过js去判断然后修改你的css样式就可以了;
问题不完整,只能这么说了
------解决方案--------------------
简单实现，L@_@K
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<title> alarm color </title>
<meta name= "generator " content= "editplus " />
<meta name= "author " content= "yixianggao " />
<meta name= "keywords " content= "javascript " />
<meta name= "description " content= "for csdn javascript region " />
</head>
<body>
<table id= "tabTarget " cellpadding= "0 " cellspacing= "0 " border= "1 ">
<tr>
<th> 姓名 </th>
<th> 年龄 </th>
</tr>
<tr>
<td> 张三 </td>
<td> <input type= "text " /> </td>
</tr>
<tr>
<td> 李四 </td>
<td> <input type= "text " /> </td>
</tr>
</table>
</body>
<script type= "text/javascript ">
<!--
var oTable = document.getElementById( "tabTarget ");
var targetColumnIndex = 1;
var ageLimit = 18;
var currentRow;
var targetElement;
var validColor = "#00ff00 "
var invalidColor = "#ff0000 "
for (var i=1; i <oTable.rows.length; i++)
{
currentRow = oTable.rows[i];
targetElement = currentRow.cells[targetColumnIndex].firstChild;
targetElement.onchange = function()
{
if (parseInt(this.value) != NaN && parseInt(this.value) > = ageLimit)
{
this.parentNode.parentNode.style.backgroundColor = validColor;
}
else
{
this.parentNode.parentNode.style.backgroundColor = invalidColor;
}
};
}
//-->
</script>
</html>
------解决方案--------------------
onMouseOver= "this.style.backgroundColor= '#ECF5FF ' " onMouseOut= "this.style.backgroundColor= '#fff ' "
当表格中某一行中得数据满足某个条件后,我想让它得字体颜色也改变,比如说变成红色.
原先得语句是: <td > <c:out value= "${item.valueN} "/> </td>
当表格中该行得数据被我编辑改变以后,我想让它得颜色也相应改变.请问这个怎么写啊?请高手赐教!
------解决方案--------------------
条件写出来，加上 <td style= "color:red "> <c:out value= "${item.valueN} "/> </td>
------解决方案--------------------
定义两个class，通过事件动态修改class
------解决方案--------------------
通过js去判断然后修改你的css样式就可以了;
问题不完整,只能这么说了
------解决方案--------------------
简单实现，L@_@K
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN " "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns= "http://www.w3.org/1999/xhtml ">
<head>
<title> alarm color </title>
<meta name= "generator " content= "editplus " />
<meta name= "author " content= "yixianggao " />
<meta name= "keywords " content= "javascript " />
<meta name= "description " content= "for csdn javascript region " />
</head>
<body>
<table id= "tabTarget " cellpadding= "0 " cellspacing= "0 " border= "1 ">
<tr>
<th> 姓名 </th>
<th> 年龄 </th>
</tr>
<tr>
<td> 张三 </td>
<td> <input type= "text " /> </td>
</tr>
<tr>
<td> 李四 </td>
<td> <input type= "text " /> </td>
</tr>
</table>
</body>
<script type= "text/javascript ">
<!--
var oTable = document.getElementById( "tabTarget ");
var targetColumnIndex = 1;
var ageLimit = 18;
var currentRow;
var targetElement;
var validColor = "#00ff00 "
var invalidColor = "#ff0000 "
for (var i=1; i <oTable.rows.length; i++)
{
currentRow = oTable.rows[i];
targetElement = currentRow.cells[targetColumnIndex].firstChild;
targetElement.onchange = function()
{
if (parseInt(this.value) != NaN && parseInt(this.value) > = ageLimit)
{
this.parentNode.parentNode.style.backgroundColor = validColor;
}
else
{
this.parentNode.parentNode.style.backgroundColor = invalidColor;
}
};
}
//-->
</script>
</html>
------解决方案--------------------
onMouseOver= "this.style.backgroundColor= '#ECF5FF ' " onMouseOut= "this.style.backgroundColor= '#fff ' "
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
