Question

我有一个页面http://www.projectdemocracy.in/，其中一些元素是动态添加的（例如 - CSS类“.fyre-comment-count”显示“X Comment”）。

我想在页面加载后修改文本。

我能够使用jQuery控制台更改文本

$(".fyre-comment-count").html($(".fyre-comment-count").text().split(" ")[0]+" Conversations");

当我在页面中输入相同内容时，它不起作用。

我也试过$(document).ready(function(){});但没有运气（与document.ajaxSuccess相同）。

同样，document.on仅适用于'click'事件，但我希望它默认完成。

$(document).on('click', '.fyre-comment-article', function() {
     //Code
    });

在document.on中是否有任何'load'类型事件？

我该怎么做才能做到这一点？

谢谢，

Answer 1

我分析了您的网页，并看到了以下代码：

var articleId = fyre.conv.load.makeArticleId(null);
fyre.conv.load({}, [{
    el: 'livefyre-comments',
    network: "livefyre.com",
    siteId: "351251",
    articleId: articleId,
    signed: false,
    collectionMeta: {
        articleId: articleId,
        url:  "http://projectdemocracy.in",//fyre.conv.load.makeCollectionUrl(),
    }
}], function() {});

似乎fyre.conv.load方法的第三个参数是一个回调函数，它将在生成所有元素时执行。

所以把你的代码放在这个函数中。它会是这样的：

...
}], function() {
    console.log('callback');
    $(".fyre-comment-count").html($(".fyre-comment-count").text().split(" ")[0]+" Conversations");
});

希望这有帮助！

修改

如果它仍然不起作用，可能是因为livefyre在创建 DOM元素之前运行此回调。解决方法是将$(".fyre-comment-count").html(...);置于setTimeout内，延迟时间最短：

... }], function() { setTimeout(function() { $(".fyre-comment-count").html($(".fyre-comment-count").text().split(" ")[0]+" Conversations"); }, 10); //minimal delay. wait till livefyre generates all needed elements });

编辑2

这是如何使其发挥作用的另一种变体：

... }], function(widget) { widget.on('commentCountUpdated', function() { setTimeout(function() { $(".fyre-comment-count").html($(".fyre-comment-count").text().split(" ")[0]+" Conversations"); }, 10); }); });

此小部件有一个commentCountUpdated事件，因此您必须对其进行订阅，并且每次注释编号更改时，您的回调都将被执行

顺便说一下，commentCountUpdated回调接收一个参数 - 注释的数量，因此您可以按如下方式重写代码：

}], function(widget) { widget.on('commentCountUpdated', function(commentsNum) { setTimeout(function() { $(".fyre-comment-count").html(commentsNum + " Conversations"); }, 10); }); });

Answer 2

jQuery有一个on load事件，如果你正在寻找它：

$(window).load(function(){ ... });

使用jQuery修改文本以在DOM中动态添加元素

2 个答案: