加载Facebook Like Box在页面内容加载完成后

我试图在加载页面内容之前延迟Facebook Like Box加载。我试图通过AJAX实现此目的，但迄今为止有混合结果。我所做的是采取下面的代码（HTML5版本）：加载Facebook Like Box在页面内容加载完成后

<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/en_US/all.js#xfbml=1&appId=147395032005356"; 
    fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk'));</script> 

<div class="fb-like-box" data-href="http://www.facebook.com/platform" data-width="292" data-show-faces="true" data-stream="false" data-header="false"></div>

...并让它坐在我自己的网站上的某个地方。

我再安装一些jQuery来获取代码，并将其附加到页面，像这样：

// set 1 second timeout 
setTimeout(function() { 
    $.ajax({ 
     url: "/facebook/likebox.php", 
     success: function(data){ 

      // add loaded data to page 
      $('#foo').append(data); 
     } 
    }); 
}, 1000);

在某些情况下（打在同一页上F5）这个工作，有的没有。

我想知道是否有更好的解决方案来实现我的目标，或者我是否真的忽略了某些东西。

来源

2012-02-17 diggersworld

为什么使用setTimeout？如果你正在等待文档准备就绪，那么在jQuery中有一个函数：http://api.jquery.com/ready/ – 2012-02-17 14:04:05

@MichaelPryor我使用'setTimeout'，因为我想在文档之后等待1秒准备。 – diggersworld 2012-02-21 09:55:36

你应该把你的JavaScript放到fbAsyncInit（）回调函数中，这样你可以放心，Facebook的JavaScript SDK已经完全加载之前把你喜欢的盒子。插入DOM后，请不要忘记拨打FB.XFBML.parse()之类的方框

window.fbAsyncInit = function() { 
$.ajax({ 
    url: "/facebook/likebox.php", 
    success: function(data){ 

     // add loaded data to page 
     $('#foo').append(data); 
     FB.XFBML.parse($('#foo')[0]); 
    } 
}); 
};

来源

2012-02-17 15:16:43 CoderFromOuterSpace

加载Facebook Like Box在页面内容加载完成后

回答

相关问题