针对js动态添加元素后，事件处理不起作用的解决方案。

不起作用的代码：

例子：$(".baby").on("click",function(){

 $(this).parent().parent().parent().append("<tr><td><input class='baby'  type='text'></td><td><input  class='reel' type='text'></td><td><input class='ifxreel'  type='text'></td><td><input class='ifxbox' type='text'></td></tr>") ;            

  })

上面的代码添加的新元素，class=“baby”的元素，在点击了之后没有了实现我们想要的点击功能。

解决方案：

$('body').on("click",'.baby',function(){
    $(this).parent().parent().parent().append("<tr><td><input class='baby'  type='text'></td><td><input  class='reel' type='text'></td><td><input class='ifxreel'  type='text'></td><td><input class='ifxbox' type='text'></td></tr>") ;  

})

改过后的代码，完全解决了之前的麻烦，当然你也可以将click事件封装成一个函数方法，在添加元素的后面再调用此方法。只是代码量会增加一倍。所以用以上方法，我认为是最好的。

转载于:https://my.oschina.net/u/3786589/blog/1790377