Question

所以在文本（文章）中，我这样说：

<div id="fb-root"></div>
<script>
    (function (d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s);
        js.id = id;
        js.src = "//connect.facebook.net/hu_HU/sdk.js#xfbml=1&version=v2.5";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
</script>

<div class="facebook_share_wrapper">
    <div class="fb-share-button"
         data-href="http://www...."
         data-layout="button">
    </div>
</div>

第一次加载良好！但是第二次，在ajax完成之后：

setTimeout(function() {
    console.log(FB.XFBML.parse());
}, 3000);

如您所见，我给了额外的时间。但是facebook分享按钮不会出现！ FB.XFBML.parse解决了许多类似的问题，但我的却没有解决...

Answer 1

我假设您也尝试动态加载JS SDK，但是如果仅将其添加到DOM（例如，使用innerHTML），则不会调用JS。另外，您不会初始化任何应用程序。

解决方案：

在页面加载时加载JS SDK-仅一次
通过FB.init初始化您的应用
在将共享按钮添加到DOM之后，立即在AJAX调用的回调中使用FB.XFBML.parse()

其他信息以及如何加载JS SDK的示例：https://developers.facebook.com/docs/javascript/quickstart

重要提示：请勿使用setTimeout，这只是一个非常糟糕的解决方法。

动态（ajax）内容加载，facebook共享按钮消失

1 个答案: