jQuery的 - 追加后进行回调 [英] Jquery - Perform callback after append

问题描述

我使用的追加内容的列表：

I am appending content to a list using:

  $('a.ui-icon-cart').click(function(){
         $(this).closest('li').clone().appendTo('#cart ul');
  });

我想执行的内容附加更多功能（其他城市类，应用动画等）

I want to perform further functions to the appended content (change class, apply animations etc)

我怎么能执行此功能的回调，让我对后附的数据执行功能？

How can I perform a callback on this function that will allow me to perform functions on the appended data?

推荐答案

jQuery的 。每（） 需要一个回调函数，并将其应用到jQuery对象中的每个元素。

jQuery's .each() takes a callback function and applies it to each element in the jQuery object.

想象这样的事情：

$('a.ui-icon-cart').click(function(){
  $(this).closest('li').clone().appendTo('#cart ul').each(function() {
    $(this).find('h5').remove(); 
    $(this).find('img').css({'height':'40px', 'width':'40px'});
    $(this).find('li').css({'height':'60px', 'width':'40px'});
  });
});

您也可以只保存结果，并进行这项工作，而不是：

You could also just store the result and work on it instead:

$('a.ui-icon-cart').click(function(){
  var $new = $(this).closest('li').clone().appendTo('#cart ul')
  $new.find('h5').remove(); 
  $new.find('img').css({'height':'40px', 'width':'40px'});
  $new.find('li').css({'height':'60px', 'width':'40px'});
});

我也建议，与其mofiying一样，你只需要添加一个类你克隆丽像这样的CSS：

I would also suggest that instead of mofiying the CSS like that you just add a class to your cloned li like this:

$(this).closest('li').clone().addClass("new-item").appendTo('#cart ul');

然后设置一些风格，如：

Then setup some styles like:

.new-item img, .new-item li { height: 40px; width: 40px; }
.new-item h5 { display: none }

这篇关于jQuery的 - 追加后进行回调的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！