Rateit插件不适用于页面加载后附加的内容

时间:2016-07-30 11:27:02

标签: javascript jquery html ajax

我正在使用http://gjunge.github.io/rateit.js/examples/

的rateit插件

每一件事情都可以正常工作,直到我在页面加载后动态加载页面上的内容。星星根本就没有出现。

我附加到页面的动态生成的内容看起来像这样(形成ajax请求):

<div class="caption">
    <p id="productNameInFeeds"><a href="https://youlense.com/view/IPHONE">
            <b>IPHONE</b></a> - I PHONE 6S</p>
    <div class="rateit" data-rateit-value="3.00"
         data-rateit-ispreset="true" data-rateit-readonly="true" data-rateit-max="10">
    </div>
    <div>
        3.00 Stars | 2 Reviews | 10 Views | 1 Followers
    </div>
</div>

我的js文件看起来像这个

$(document).ready(function() {
var page = 1;

$("#load_more_feeds").click(function(){
    $.post("my/feeds/more",
            {
                page: page
            },
            function(data, status){

                if(data != ''){
                    $("#feedHolder").append(data);
                    page = page + 1;
                }

            });
$('div.rateit, span.rateit').rateit();
});

});

有谁能告诉我解决方案?

提前致谢

1 个答案:

答案 0 :(得分:4)

找到了这个:https://scrollrevealjs.org/

在您添加新内容后,请调用:

$('div.rateit, span.rateit').rateit();

这会初始化所有rateit元素。