如果value =<我可以让表格单元格有不同的背景颜色吗?使用jquery或PHP获取特定的数字

Can I make a table cell have a different background color if the value =< a particular number with jquery or PHP?

本文关键字：使用 背景 颜色 jquery 数字 获取 PHP value 我可以 单元格 表格      更新时间：2023-09-26

我有一个HTML表格，里面有很多数字。

如果单元格(或列)内的值等于或小于一个特定的数字，是否有可能有一个表单元格改变背景颜色?

例如:if cell =<"3000",background - color = # FF0000

有没有办法让这个在现实中工作?

Erik

下面是一个使用JS/Jquery的示例

$("#Yourtable td").each( function() {
     var thisCell = $(this);
     var cellValue = parseInt(thisCell.text());
     if (!isNaN(cellValue) && (cellValue <=3000)) {
         thisCell.css("background-color","#FF0000");
      }
  }
 )

试试这个

var table = document.getElementById("tableId");
var row = table.rows[rowIndex];
var cell = row.cells[cellIndex];
var cellValue = Number(cell.innerHTML);
if (cellValue > 3000)
  cell.style.backgroundColor = "red";

是的，做这类事情很容易。

例如，使用jQuery，像这样:

$('table.mytable td').each(function() {
  if (this.textContent <= 3000) {
    $(this).css('background', '#FF0000');
  }
}

您可以使用如下代码:

$(".colorMe td").each(function() {
    var val = parseInt(this.innerHTML, 10);
    if (val < 3000) {
        this.style.backgroundColor = "#F00000";
    }
});

查看这里的工作示例:http://jsfiddle.net/jfriend00/GAwrB/.

示例如下//CSS 

.lowerthan100{
 background-color:red;
 color:white;   
}
.higherthan100{
 background-color:white;   
 color:red;
}

//JAVASCRIPT
$('#mytable td').each(function() {
    if(parseInt($(this).html())>100){
    $(this).addClass("higherthan100");
    }else if (parseInt($(this).html())<100){
    $(this).addClass("lowerthan100");
    }    
 });

//HTML 

<table border="1px" id="mytable">
    <tr><td>99</td><td>101</td></tr>
    <tr><td>200</td><td>50</td></tr>
</table>

如果你需要更多的条件，你可以在CSS和else if语句中填充更多的class。

下面是一个实例http://jsfiddle.net/kayadiker/DL6U2/2/

相关文章：