web-dev-qa-db-ja.com

tr背景色の変更

私はこのようなものを持っています:

<tr id='<%=currentRow %>' onclick="SetBackgroundColor(this)" style="background-color:Yellow">

行をクリックすると、背景色を変更したいので、次のようにしました。

function SetBackgroundColor(rowId) 
{
     $(rowId).css("background-color", "#000000");
}

しかし、なぜ機能しないのか分かりません。何か提案はありますか?

17
user158625

IEには、TR要素の背景色に問題があります。より安全な方法は、TR内のTDとTHの背景を設定することです。

<table id="tabletest">
    <tr>
        <td>testcell</td>
    </tr>
</table>

<script>
$('#tabletest tr').bind('click', function(e) {
    $(e.currentTarget).children('td, th').css('background-color','#000');
})
</script>

追加:テーブル全体に単一のイベントハンドラを割り当てて、パフォーマンスを向上させることができます。

$('#tabletest').bind('click', function(e) {
    $(e.target).closest('tr').children('td,th').css('background-color','#000');
});
34
David Hellsing

JQueryでは、イベントハンドラーを割り当てるためにonclick属性を使用する必要はありません。影響を与える各trにmytrというクラスを追加するとします。その後、次のようなことができます:

 $(document).ready(function(){
        $(".mytr").click(function(){
             $(this).css("background-color", "#000000");
        });
 });

そして、クラスmytrを持つすべての行にイベントハンドラーを適用します。

9

新しい行をクリックすると、各行がリセットされます...

$(document).ready(function(){

  $('tr').click(function(){
    $('tr td').css({ 'background-color' : 'green'});
    $('td', this).css({ 'background-color' : 'red' });
  }); 

});

デモ: http://jsbin.com/aciqi/

6
luckykind
 $('#RowID').children('td, th').css('background-color','yellow');
2
Raj

より簡単な解決策は、おそらくテーブルまたはaddClassのすべての行にセレクターを使用することです。

$("#myTable tr").click(function() {
    $(this).css('background-color', '#f00');
});

または

$("#myTable tr").click(function() {
    $(this).addClass('selected');
});
1
Pauly

ありがとうございます。問題は、マスターページでjquery-1.3.2.min.jsbeforequery-1.3.2-vsdoc.jsそして、それはそれが機能していなかった方法です。

0
user158625

表の行の背景色を変更する代わりに、表のセルの背景色を変更してみてください。

$(document).ready(function() {
    $(".mytr td").click(function() {
         $(this).css("background-color", "#000000");
    });
});
0