0

I have an html table like this one to automaticaly validate the data received from some soil pollutants analyses : 

<table id="table1">
  <thead class="fixedHeader">
<tr><input type="submit" value=" Validate "/><input type="reset"value="réinitialiser" "></tr> 
</thead>
   <tbody id="form1" class="scrollContent">
<tr>
   <td>COT</td>
   <td><input type="text" class="cellData" name="celula1" id="celula1" value="" /</td>
   <td>mg/kg</td>
   <td id="soilMessage1" class="y_n" ></td>
</tr>
<tr>
   <td>HCT C10-C40</td>
   <td><input type="text" class="cellData" name="celula2" id="celula2" value="" /></td>
   <td><p>mg/kg</p></td>
   <td id="soilMessage2" class="y_n"></td>
</tr>
</table>

and this goes on for 37 cells but i posted just two to give you an ideea. Now I am trying to color the background of the cells "soilMessageX" according to the results obtained from this little script : 

window.onload=function() {
document.getElementById("form1").onsubmit=function() 
   {
    var celula1 = parseInt(this.celula1.value,10); 
    celula2 = parseInt(this.celula2.value,10);
       {
var text1 ;  
 if (celula1 <= 399)  text1 = "FNADE Classe 3"; 
  else if (celula1 >= 400 && celula1 <= 1800) text1 = "FNADE Classe 2";  
  else if (celula1 >= 1801) text1 = "FNADE Classe 1" ;
  else text1 = "SVP inserez des donnes";
   document.getElementById("soilMessage1").innerHTML=text1; 
var text2 ; 
 if (celula2 <= 499) text2 = "FNADE Classe 3";  
  else if (celula2 >= 500 && celula2 <= 2000) text2 == "FNADE Classe 2";  
  else if (celula2 >= 2001 && celula2 >= 10000) text2 == "FNADE Classe 1";
  else if (celula2 > 10000 ) text4 = "Concentration trop élevée";
  else text2 = "SVP inserez des donnes";
   document.getElementById("soilMessage2").innerHTML=text2;
return false  
    }
    }   
     } ;

and this also goes on for 37 cells. (if you could give me an idea on how to simplify this I would be also grateful but this is not the main thing ).

I tried to use this script to change the color of the answer cell :

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js"></script>
<script  type="text/javascript">
$(document).ready(function() {
$("#form1 td.y_n:contains('FNADE Classe 3')").css('background-color','#fcc');
 });
</script>

but whith no results.

Could somebody please enlighten me ? Thank You

4

1 回答 1

1

您可以循环浏览 y_n 个单元格并采取相应措施：

$('#table1 td.y_n').each(function () {
    // 'this' is the cell so you can do your checks and then
    $(this).css(...);
});
于 2013-07-22T14:31:42.703 回答