Установка цвета фона обратно на оригинальный после изменения его в jquery

Question

В основном у меня есть таблица с множеством строк.Таблица чередуется между белым и серым фоном с использованием некоторого css

.profile tr:nth-child(odd)    { background:#eee; }
.profile tr:nth-child(even)    { background:none; }

Теперь я хочу, чтобы пользователь мог выбрать строку, и она выделяется желтым цветом.Сделано с помощью простого Jquery

    $(".Select").click(function() {
        //Deselect all other Rows
        $(".Select").show().prev().hide().parent().parent().css('background', 'none');



        //get Id
        var Row = $(this).parent().parent();
        var MatchId = Row.attr('id');
        $(this).hide().prev().show();
        Row.css('background', '#FFFFBA');
    });

Проблема в том, что я беру все строки с помощью $ (". Select") ....... parent (). Parent (). Css ('background....

установка его в "none" делает все строки белыми и теряет альтернативную окраску, если есть способ вернуть свойство background в исходное состояние.

Answer 1

создать третий класс:

.profile tr.hover    { background:#FFFFBA; }

вместо

 Row.css('background', '#FFFFBA');

вы делаете

  Row.addClass("hover");

и вместо

  $(".Select").s.//.parent().css('background', 'none');

Вы делаете

  $(".Select").s.//.parent().removeClass("hover");

// просто для сокращения длинной строки.

Answer 2

Каспар здесь прав, по нескольким причинам:

1. Вы держите свою презентацию в CSS
2. Браузеры применяют CSS быстрее, чем манипулируют объектом стиля в JavaScript
3. Если добавить к выделенному элементу дополнительные стили (например, рамку, полужирный текст и т. Д.), Это не повлияет на производительность (см. Причину 2).

Сказав это, если вы хотите просто сохранить свой код, просто удалите нечетные строки из вашего селектора jQuery с помощью селектора $.not():

$(".Select").show().prev().hide().parent().parent().not(':nth-child(odd)').css('background', 'none');

Answer 3

$(".Select").show().prev().hide().parent().parent().css('background', '');

Answer 4

Вместо всех этих проблем, просто используйте селектор CSS для TR в вашей таблице стилей .css и используйте разметку :hover, и пусть браузер справится с этим. Любую работу, которую вы можете перенести в основной браузер, вам следует.

Однако из вашего кода я не совсем уверен, что это то, что вы хотите сделать. Похоже, вы хотите изменить фон какой-то строки, отличной от той, на которой вы находитесь. Если это так, то вам нужно прикрепить бит .data() к целевому объекту и использовать событие отключения мыши, чтобы вернуть его обратно из того, что вы сохранили.