如何从下拉列表中替换表格单元格值?

时间:2012-07-12 11:26:55

标签: javascript jquery drop-down-menu

我需要按摩"一个HTML表格。

在页面上有一个下拉列表:

<SELECT CLASS='slctor' size='1' NAME='KEYVAL' ID='KEYVAL' >
                  <OPTION VALUE='{*}'>*
                  </OPTION>
                  <OPTION value='10'>green
                  </OPTION>
                  <OPTION value='20'>green
                  </OPTION>
                  <OPTION value='30'>green
                  </OPTION>
                  <OPTION value='40'>yellow
                  </OPTION>
                  <OPTION value='90'>red
                  </OPTION>
                </SELECT>

我还有一个包含Person / year的表和每对的值:

<table>
<tr>
  <td></td>
  <td>2001</td>
  <td>2002</td>
  <td>2003</td>
</tr>
<tr>
  <td>JOE</td>
  <td>10</td>
  <td>30</td>
  <td>90</td>
</tr><tr>
  <td>BETTY</td>
  <td>20</td>
  <td>20</td>
  <td>40</td>
</tr>
</table>

我想使用jQuery来解决&#34;来自下拉值的每个单元格值,返回标签,并替换单元格内容(或背景颜色)。

我能够像在实际的DOM操作中那样做基础知识,但我需要帮助实际以有效的方式进行查找。

1 个答案:

答案 0 :(得分:0)

Try this:

$(".slctor").change(function(){
    var selectedVal=$(this).val();
    $('table').find('td').filter(function(){return $(this).text() ==selectedVal}).css("background-color","red");
   //or
      $('table').find('td').filter(function(){return $(this).text() ==selectedVal}).text("New Text");
});