javascript - 新しい tr を選択した後、選択した tr の色を元に戻します

Question

これまでの<tr>ところ、行がクリックされたときに内のラジオボタンを選択し、クリックされた<tr>ときにの色を変更するために必要なコードのほとんどを理解しましたが、色を元に戻したり変更したりできる必要があります<tr>ユーザーが別の色を選択した場合の新しい色。現在、行の色を変更し続けていますが、元に戻すことはありません。コードは以下のとおりです。

<script>
var prevTr;
$('tr').click(
        function() {
            $('input[type=radio]',this).attr('checked','checked');
            $(this).addClass('selectedtr');//css('background-color', 'Green');
            prevTr = $(this).id;
            $("#"+prevTr).removeClass('selectedtr');
        }
    );
...

Answer 1

selectedtr最初にすべての要素からクラスを削除しtrてから、現在の要素に追加します。

$('tr').click(
        function() {
            $('input[type=radio]',this).prop('checked','checked');
            $(this).siblings().removeClass('selectedtr');
            $(this).addClass('selectedtr');
        }
    );

編集- David Thomas の答えはあなたが探しているものではないと思いますが、選択はすべての要素siblings()を選択するよりも効率的だと思います。tr

別の編集

あなたのコメントを参照して:propの代わりに使用する必要がありattrます。ここにフィドルがあります：

http://jsfiddle.net/xQyAV/

Answer 2

私はcssを使用します：

binput[type=radio]:hover {
     //here edits
     //the setting back happens automaticly
}

Answer 3

id現在のエンティティを思い出す前に、クラスを削除するだけでよいと思います。

$(function () {
    var prevTr = false;
    $('tr').click(function () {
        if (prevTr) {
            $("#" + prevTr).removeClass('selectedtr');
        }
        prevTr = $(this).id;
        $('input[type=radio]', this).attr('checked', 'checked');
        $(this).addClass('selectedtr');
    });
});