jquery删除所选表格的行背景颜色

Question

如何在jquery的帮助下删除所选行的背景颜色？

让我们假设用户选择id = 3的行，我需要删除背景颜色。

<table class='css_table' style='width: 100%'>
<tr>
    <th style='width: 20%'>Kimden</th>
    <th style='width: 25%'>Konu</th>
    <th style='width: 25%'>Mesaj</th>
    <th style='width: 10%'>Okundu</th>
    <th style='width: 20%'>Tarih</th>
</tr>
<tr id='3' class='selected_row' style='cursor: pointer; background-color: #E0EEEE'>
    <td><span class='row_name'>Prof. Dr.altay tinar</span></td>
    <td><span class='row_subject'>asda da dasd asdasda</span></td>
    <td><span class='row_body'>asda da dasd asdasda</span></td>
    <td><span>0</span></td>
    <td><span class='row_time'>4/15/2013 3:40:40 AM</span></td>
</tr>
<tr id='5' class='selected_row' style='cursor: pointer;'>
    <td><span class='row_name'>Ped.Arifx Yilmazx</span></td>
    <td><span class='row_subject'>undefined asd asdsa </span></td>
    <td><span class='row_body'>qdqw dqw d asda sd </span></td>
    <td><span>1</span></td>
    <td><span class='row_time'>4/15/2013 3:42:36 AM</span></td>
</tr>

Answer 1

使用jQuery's css function删除背景颜色值：

var selectedId = 3;
$("#" + selectedId).css("background-color", "");

Answer 2

尝试更具体一点：

$(".css_table tr[id='3']").css("background-color", "");

DEMO HERE

Answer 3

尝试如下，它会帮助你...

以下函数删除用户单击的表格行背景..

小提琴： http://jsfiddle.net/RYh7U/139/

JQuery：

$(".css_table tr").click(function(){
    $(this).css("background", "");
});

Answer 4

您可以试用此代码

  $(document).ready(function () {
     $(".selected_row").css("background-color", "");
   });

Answer 5

试试这个

#HTML

<table class="css_table" border="1px">
<tr class='css-row'>
    <th style='width: 20%'>Kimden</th>
    <th style='width: 25%'>Konu</th>
    <th style='width: 25%'>Mesaj</th>
    <th style='width: 10%'>Okundu</th>
    <th style='width: 20%'>Tarih</th>
</tr>
<tr id='3' class='css-row'>
    <td><span>Prof. Dr.altay tinar</span></td>
    <td><span>asda da dasd asdasda</span></td>
    <td><span>asda da dasd asdasda</span></td>
    <td><span>0</span></td>
    <td><span class='row_time'>4/15/2013 3:40:40 AM</span></td>
</tr>
<tr id='5' class='css-row' >
    <td><span class='row_name'>Ped.Arifx Yilmazx</span></td>
    <td><span class='row_subject'>undefined asd asdsa </span></td>
    <td><span class='row_body'>qdqw dqw d asda sd </span></td>
    <td><span>1</span></td>
    <td><span class='row_time'>4/15/2013 3:42:36 AM</span></td>
</tr>
<table>

#CSS Style

.css-table
{
   width:100%;
}
.css-row
{
    cursor: pointer; 
    background-color: #E0EEEE;
    font-weight:normal;
}
.css-selectedrow
{
    color:blue;
    cursor: pointer;
    font-weight:normal;
    background-color: #fff;
}

#Script

$(document).ready(function(){
    $("tr").click(function(){
      $("table tr").addClass("css-row");
      $(this).removeClass("css-row");
  });
});