Делегирование событий JavaScript без фактического события? - PullRequest
Новая
       14

Делегирование событий JavaScript без фактического события?

0 голосов
/ 17 августа 2011


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

$(document).ready(function(){
    //add background-color to all odd rows
    //very important!!!
    $("#tab3 tbody tr:odd").css("background-color", "#DCF1FD");
    //change color on hover 
    //less important!!!     
    $("#tab3 tbody tr").hover(
      function () {
        $(this).css("color", "red");
      },
      function () {
        $(this).css("color", "#000");
      }
    );
});

Есть ли способ заставить его работать после того, как я отредактирую таблицу.

РЕДАКТИРОВАТЬ:
Это должно работать на IE8

Ответы [ 2 ]

1 голос
/ 17 августа 2011

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

$(document).ready(function(){
    $("#tab3 tbody tr:odd").css("background-color", "#DCF1FD");


    $("#tab3").delegate('tbody tr', 'hover', function(){
        $(this).css("color", "red");
      },
      function () {
        $(this).css("color", "#000");
    });
});

Если вы динамически обновляете всю таблицу, используйте эту 

$(document).delegate('#tab3 tbody tr', 'hover', function(){
        $(this).css("color", "red");
      },
      function () {
        $(this).css("color", "#000");
 });

Вы можете установить цвет фона нечетной строки с помощью простого CSS 

#tab3 tbody tr:nth-child(odd)
{ 
   background: #DCF1FD; 
}
0 голосов
/ 17 августа 2011

... Или вы можете просто использовать CSS для определения фона для четных строк, нечетных строк и состояния наведения.Se первый ответ на этот вопрос .(РЕДАКТИРОВАТЬ: исправлена ​​ссылка, это указывало на неверный поток SO).

...