Предварительное добавление и анимация текста, загруженного через AJAX с помощью jQuery

Question

Старая рука с Prototype, новичок в jQuery, и написание простого приложения, чтобы получить представление о фреймворке (и потому, что я хочу его использовать). У меня есть фрагмент HTML, который я загружаю через AJAX, и я хочу поместить его в верхнюю часть div с анимацией перехода в виде слайда.

Этот бит работает и выполняет предшествующий бит:

// Get the HTML fragment and stick it at the top of the containing div.
$.post("/create_new_thing", function(data) {
    $('#container_div').prepend(data);
});

То, что я хотел бы сделать, и не могу понять, это анимировать недавно добавленный HTML-фрагмент с эффектом show ().

Есть предложения?

Answer 1

Попробуйте что-то вроде этого ...

$('#div').load('file.html').fadeIn("slow"); 

Функция загрузки лучше подходит для ваших нужд, так как ее основная цель - загрузить HTML из удаленного файла и вставить его в DOM.

Использование функции «post» лучше для загрузки удаленной страницы с помощью POST-запроса (публикация данных через форму и возврат динамических данных на основе вашего почтового запроса).

См. Ниже ...

$.post("file.php", { name: "superuntitled", time: "2am" },
function(data){
  $('#div').fadeIn("slow").append(data);
});

jQuery пока не поддерживает запросы "PUT". Поэтому, если вам действительно нужно использовать запрос на размещение, я могу порекомендовать расширить функциональность jQuery пользовательской функцией, которая добавляет поддержку «PUT». Тем не менее, есть некоторые обходные пути! Смотрите здесь для более подробной информации! ... http://homework.nwsnet.de/news/9132_put-and-delete-with-jquery

Answer 2

Я использую это

 $.post("yourdocument.php", {parameter:"caucana.com"}, function(data) {
        $('#contiene_resultados').prepend(data);
  });

Answer 3

Это то, что я использую для добавления нового сообщения в список:

success: function(data){
  $("#posts-container").prepend(data).children().first().hide().show('slow');
}

Предполагается, что добавленный элемент обернут в div и находится первым в # posts-container.