javascript - 许多 facebook 喜欢页面上的按钮，异步

Question

我正在为在我们网站上写过消息的人建立一堵墙。对于每条消息，我想包含一个 Facebook Like 按钮。但是 Facebook 的实现是在构建 fb:like 标签之前包含脚本标签。

 <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
      <fb:like href="http://example.com/MessageWall.aspx/Fan/222" 
            show_faces="false" width="250">
 </fb:like>

我尝试过这种方法，但是因为我一次在页面上显示 121 个人，所以页面性能，可以说，低于标准。我不敢相信我每次都必须包含脚本标签。

我现在正在尝试以异步方式执行此操作。

我试过这个:

    (function() {
        var e = document.createElement('script'); e.async = true;
        e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js#xfbml=1';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(e, s);
    }());

    var firstHalfOfLikeButton = '<fb:like href="http://example.com/MessageWall.aspx/Fan/';
    var secondHalfOfLikeButton = '" layout="button_count" show_faces="false" width="250"></fb:like>';
    var userId, divId;
    for (var x=0; x<listOfIdsOfActiveTiles.length; x++) {
        userId = listOfIdsOfActiveTiles[x][0];
        divId= listOfIdsOfActiveTiles[x][1];
        $("div#" + divId+ " .hbo-message").append(firstHalfOfLikeButton + userId + secondHalfOfLikeButton);
    }

在循环并将 fb:like 标记附加到每个位置之前，我还尝试像这样将 all.js 异步附加到 fb-root。

 (function() {
    var e = document.createElement('script'); e.async = true;
     e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js#xfbml=1';
         document.getElementById('fb-root').appendChild(e);
 }());

我还尝试循环创建 fb:like 标签，然后附加 all.js 文件。

更新:在每个实例中，我都可以看到

有没有人有什么想法？

谢谢， 斯科特

更新

事后返回此页面，但我最终做的是在单击项目时为每个人的图像动态构建一个“赞”按钮。因此，我的 onclick 代码会检查它是否不存在，如果不存在，则使用我上面的构建 block 构建它。

这样，我就不必在页面加载时创建 121 个类似的按钮。相反，我按需创建它们。

您可以在 honeybunchesofoats.com 查看完成的项目

Answer 1

您只需包含一次 facebook 脚本，而不是为每个点赞按钮包含一次。然后它将在页面中搜索所有 xfbml 元素。