Блог

Итак, в настоящее время я использую следующее:

 $.ajax({
    type: "GET",
    url: "file.php",
    success: function(html) {
        $("#tableRow").after(html);
    }
});
  

которая аккуратно добавляет новую строку (или rows) в существующую таблицу.
file.php возвращает:

 <tr><td>stuff</td></tr>
  

Я могу добавлять по одной строке за раз.
Я пытаюсь анимировать только недавно добавленную строку, например:

 $("#tableRow").after(html).animate({ backgroundColor: "#bce4b4" }, "fast")
  

но это выделяет строку, после которой я добавляю новую строку. Я не могу заставить его применить только к этой новой строке. Как я могу это сделать?

Обновить:

Основываясь на полученных ответах, я собрал это воедино: http://jsfiddle.net/jreljac/5ctpc/3 / где я делаю следующее:

 $("<tr><td>2 1</td><td>2 2</td></tr>").insertAfter("#tableRow").animate({
    backgroundColor: "#bce4b4"
}, "slow");
  

(Я заменил то, что file.php передам с текстом»), и это, похоже, не работает. Он создает строку, но не анимирует. Я упускаю что-то простое?

Пользователь insertAfter вместо этого. Затем он анимирует правильную строку.

 $(html).insertAfter("#tableRow").animate(...
  

Попробуйте вместо этого использовать insertAfter()

 $(html).insertAfter('#tableRow').animate({ backgroundColor: "#bce4b4" }, "fast");
  

Это сделает то, что вы хотите:

 $(html).insertAfter('#tableRow').animate({ backgroundColor: "#bce4b4" }, "fast")
  

Хотя ‘html’ — это всего лишь строка, вы все равно можете обернуть ее в $() , чтобы превратить в объект jQuery.