如何选择动态添加的元素

时间:2016-02-09 13:51:06

标签: jquery html css

http://lifeto.cafe24.com/xe/request#

如果你转到这个页面,我已经使用了以下代码,以便在我滚动页面时给出'fadein'效果。 我已经通过使用jquery addclass和animate.css

完成了这项工作

https://daneden.github.io/animate.css/

同时我使用了jscroll.js来赋予它无限的滚动效果。

jQuery(document).ready(function() {
    jQuery('tr').waypoint(function() {
        jQuery('tr').addClass('animated fadeIn');
    }, {
        offset: '75%'
    });});

这是我用于无限滚动的脚本

/* infinite scroll */
jQuery(document).ready(function(){
    jQuery('.board_content').jscroll({
        loadingHtml: '<center><img src="layouts/window/ajax-loader.gif" alt="Loading" /> Loading...</center>',
        padding: 0,
        contentSelector: '.board_list',
        autoTriggerUntil: 5,
        nextSelector:'.next_button'
    }); 
});

正如您所看到的,前10个是可见的,因为addclass工作正常。

但是对于接下来的20秒仍然是不透明度:0因为它们稍后被jscroll.js动态添加到dom中

有谁能告诉我如何解决这个问题?

感谢。

1 个答案:

答案 0 :(得分:1)

您需要在添加内容后运行waypoint脚本以绑定它们。

类似的东西:

$('.infinite-scroll').jscroll({
    loadingHtml: '<img src="loading.gif" alt="Loading" /> Loading...',
    padding: 20,
    nextSelector: 'a.jscroll-next:last',
    contentSelector: 'li',
    callback: function() {
       jQuery('tr').waypoint(function() {
          jQuery('tr').addClass('animated fadeIn');
          }, {
             offset: '75%'
       });
    }
});