Загрузите Facebook Like Box после завершения загрузки содержимого страницы - PullRequest
1 голос
/ 17 февраля 2012

Я пытаюсь отложить загрузку Facebook Like Box до загрузки содержимого страницы. Я пытаюсь добиться этого с помощью AJAX, но пока у меня смешанные результаты.Что я сделал, так это взял приведенный ниже код (версия HTML5):

<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 на той же странице) это работало, а в некоторых - нет.

Мне было интересно,есть какие-то лучшие решения для того, чего я пытаюсь достичь, или же я что-то упустил.

1 Ответ

1 голос
/ 17 февраля 2012

Вы должны поместить свой javascript в функцию обратного вызова fbAsyncInit (), чтобы вы могли быть уверены, что Facebook JavaScript SDK полностью загружен, прежде чем ставить поле «Нравится».Не забудьте позвонить FB.XFBML.parse() после вставки DOM для подобной коробки

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

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