在 Ajax 请求后创建 Facebook 分享按钮

Question

当前情景： 用户在我的网站上通过 Facebook 登录。登录后，立即使用 Ajax 向他提供随机内容（一个快乐的短语）。此内容链接到 OpenGraph 有效的静态页面（尊重 Facebook OpenGraph 最佳实践）。同时会弹出 Facebook Share 弹窗，他/她可以在 Facebook 上分享他/她的快乐短语。

利益相关者（又名妻子）期望的情景：

共享弹出窗口不应自动弹出。应该用JS生成一个动态的“fb分享按钮”，所以：用户读到开心的短语，用户很开心，用户在facebook上点击分享。

我的尝试：

$.getJSON( "ajax/fortune.php?id="+response.id, function( data ) {
   console.log(data);
   $( "#result" ).html( data.message );
   $("#shareButton").html('<div class="fb-share-button" data-href="http://www.-----.com/cookie/'+data.cid+'" data-layout="button_count"></div>');
});

结果：没有任何反应。我只需要把那个按钮放在那里。

我的计划 B 将放置一个带有指向 FB sharer.php 的链接的 img 按钮或引导共享按钮。但我认为这不是一个好的方法。

任何线索:)？

RMK：使用 jquery 1.11.3

Answer 1

你必须在添加之后渲染它。

$.getJSON( "ajax/fortune.php?id="+response.id, function( data ) {
   console.log(data);
   $( "#result" ).html( data.message );
   $("#shareButton").html('<div class="fb-share-button" data-href="http://www.-----.com/cookie/'+data.cid+'" data-layout="button_count"></div>');
   FB.XFBML.parse(document.getElementById('shareButton'));
});