如何将样式添加到无限滚动附加 DOM

【问题标题】：how to add style to infinite-scroll append DOM如何将样式添加到无限滚动附加 DOM
【发布时间】：2018-03-28 11:34:56
【问题描述】：

我使用infinite-scroll有问题，因为附加会失败，即使我使用外链接脚本也失败了。

这是我需要附加使用的代码

$("video").css({'width':'580px','height':'432px'});

我找到了一些关于使用.on() 或.bind() 的解决方案，但它只适用于鼠标事件，我使用$("video").on('load',function(){...}) 也失败了。

$("video").on('load',function(){
    $(this).css({'width':'580px','height':'432px'});    
});

滚动功能也有同样的问题：window scoll 功能不能在 append html 中工作，但可以在其他页面工作，没有无限滚动效果。

我该如何处理这个问题？

【问题讨论】：

【解决方案1】：

要添加 CSS，为什么不直接将其添加到您的样式中？

video {
    width: 580px;
    height: 432px;
    }

如果您需要使用 JQuery，请在附加事件处理程序时绑定到页面中存在的元素并使用事件委托。

$(document).on('loadeddata', 'video', function(){
    $(this).css({'width':'580px','height':'432px'});

});

您可以使用更接近的元素而不是 $(document)，例如 $("#videoContainer")。如果在页面加载时包含元素存在，您可能会在那里绑定。这只需要绑定一次。

或者，您需要在添加新内容后重新绑定。

$("video").unbind("loadeddata");
$("video").on("loadeddata", function () {
        $(this).css({'width':'580px','height':'432px'});
    });

【讨论】：