Ajax-loading FB“like”按钮只在第一次工作答案

【问题标题】：Ajax-loading FB "like" button only works the first timeAjax-loading FB“like”按钮只在第一次工作
【发布时间】：2015-07-16 19:02:31
【问题描述】：

我有一个网站，其中页面的一部分（#main-inner 块）通过 AJAX 加载，以加快导航速度。这个页面片段可以包含各种社交按钮（twitter、G+、facebook），这些按钮在 AJAX 调用成功完成并且 HTML 被注入页面后被初始化。

当访问者在页面上时，这种 AJAX 加载可能会发生多次：每次 #main-inner 块被删除（通过 jQuery）并在 AJAX 调用成功时重新创建。

我的问题是 facebook “like” 按钮仅在第一次 AJAX 调用后正确初始化。在以下调用中，facebook 按钮不再出现，并且过了一会儿，控制台显示此错误消息：fb:like failed to resize in 45s。

其他社交按钮工作正常。

这是我在 #main-inner 块的内容发生更改后用于初始化 facebook 按钮的函数：

var loadFacebook = function () {
    if ($('.fb-like').length){
        var options = {
            status: true,
            cookie: true,
            xfbml: true,
            appId: XXXXXXXXX
        };
        if (typeof (FB) != 'undefined') {
            // FB.init(options);
            FB.XFBML.parse(document.getElementById('main-inner'));
        } else {
            $.getScript('//connect.facebook.net/fr_FR/all.js', function () {
                FB.init(options);
            });
        }
    }
};

为什么它只在第一次工作？...有没有办法在重新初始化新按钮之前重置或卸载上一个按钮？

【问题讨论】：

标签： jquery ajax facebook xfbml

【解决方案1】：

我已经设法通过在每次重新初始化时清空FV 变量来重置（并重新加载）facebook 按钮。所以现在的功能是：

var loadFacebook = function () {
    if ($('.fb-like').length){
        var options = {
            status: true,
            cookie: true,
            xfbml: true,
            version: 'v2.3',
            appId: XXXXXXXXX
        };
        FB = null; // <- that's the key
        $.getScript('//connect.facebook.net/fr_FR/all.js', function () {
            FB.init(options);
        });
    }
};

我仍然很想知道是否有更好（更清洁？）的方法来做到这一点。

但是我不确定这是否足够，因为尽管现在在每次加载 AJAX 后正确显示了“赞”按钮，但似乎无法读取页面中新注入的 ajax 数据，因此无法读取弹出窗口中的所有字段（单击按钮时打开）是空的... :-(

【讨论】：