Обновление альтернативных цветов строк динамической / AJAX таблицы с помощью jQuery

Question

Выглядело много, но не смог найти, применил альтернативные цвета строк через jQuery к событию $(document).ready.

$(document).ready(function(){  

    //Member Directory Table  
    $('.MemberDetail table tr:odd ').css('background','#F0F0EC');  
}  

цвета применяются, но когда таблица обновляется с помощью запроса ajax, она не обновляет цвета. Так что может быть лучшим способом применить альтернативные цвета к этой таблице?

На этой странице есть пример:

Здесь динамическая таблица

Answer 1

Вы должны использовать этот скрипт, когда Ajax завершен.Я имею в виду что-то вроде

$.ajax({
  url: 'ajax/test.html',
  success: function(data) {
    //to do your jQuery code again;
    $('.MemberDetail table tr:odd ').css('background','#F0F0EC');
  }
});

Answer 2

после выполнения запроса ajax

function ajax() {
doAjaxStuff();

$('.MemberDetail table tr:odd ').css('background','#F0F0EC');
}

вам придется снова выполнить функцию цвета таблицы.

Answer 3

Если вы используете класс CSS, например, такой:

.alternate
{
    background: #e6f4ff;
}

чтобы применить альтернативный цвет к строкам таблицы, проще ... после некоторого jQuery добавления строк таблицы динамически, вы можете сделать что-то вроде этого:

$("table tbody tr").removeClass("alternate").filter(":odd").addClass("alternate");

Это должно держать строки правильно окрашенными независимо от того, что вы делаете: будь то добавление или удаление <table> строк.

Просто помните, что вам придется всегда запускать код каждый раз, когда <table> изменяется.

Answer 4

Просто обновите таблицу снова:

$('.MemberDetail table').find('tr:odd').css('background','#F0F0EC').end().find('tr:even').css('background','#fff');

Нет волшебного способа автоматически поддерживать эти цвета, просто нужно обновлять каждый раз, когда вы обновляете таблицу.