的jQuery与去年孩子追加后

Question

我似乎有，我可以不在身边让我的头一个非常基本的问题，我希望有人能够帮助我......

我有一个“包装”用股利三个'网页'div。当最右边的div被点击时，这个应该成为中间的一个。我发现了一个很好的方法，首先克隆第一个子div并在最后附加它，然后动画留下“包装器”div，然后移除原始的第一个子div并恢复“包装器”div的原始位置。

但问题是，这只适用于原始DOM中的第一次点击;也就是说，它不能将附加的div识别为新的最后一个孩子......任何人都可以帮我解决问题吗？

jQuery的

$(document).ready(function() { 
      $('#wrapper div:last-child').click(function() { 
       $('#wrapper').animate({'left' : '-33%' }, 500, function() { 
        $('#wrapper div:first-child').clone(true).appendTo('#wrapper'); 
        $('#wrapper div:first-child').remove(); 
        $('#wrapper').css('left', '0'); 
       }); 
      }); 
     }); 

HTML

<div id="wrapper"> 
     <div class="page" id="p1">1st</div> 
     <div class="page" id="p2">2nd</div> 
     <div class="page" id="p3">3rd</div> 
    </div> 

Answer 1

$('#wrapper').on('click', 'div:last-child', function() { 
    $('#wrapper').animate({ 
     'left': '-33%' 
    }, 500, function() { 
     $('#wrapper div:first-child').clone(true).appendTo('#wrapper'); 
     $('#wrapper div:first-child').remove(); 
     $('#wrapper').css('left', '0'); 
    }); 
}); 

正如你所添加的div到#wrapper动态，所以你需要委托事件处理程序。使用jQuery .on()你可以像上面那样绑定click。

的.on()为代表事件的语法是：

$(staticParent).on(eventName, targetChild, handler); 

在哪里，staticParent指不是动态的目标元素（动态元件）的容器中。