ФБ.XFBML.Парс не работает в IE

Привет, я использую кнопку Facebook like в моем интернете. Весь мой контент загружается через ajax, и я пришел к выводу, что если вы хотите использовать кнопку Facebook like с загруженным контентом ajax, вы должны использовать FB.XFBML.parse(). Я использовал это, и он хорошо работает в firefox и chrome, но он не работает в IE. Я проверяю с IE 8 еще. Я искал решение и нашел здесь, чтобы добавить xmlns:fb="http://www.facebook.com/2008/fbml" в мой html-тег. Я сделал, но это еще не исправлено. Мой код выглядит как

  layout.php

 <div id="fb-root" style="display:none"></div>
    <script>
        window.fbAsyncInit = function() {
        FB.init({
          appId      : 'APPID', // App ID
          status     : true, // check login status
          cookie     : true, // enable cookies to allow the server to access the session
          xfbml      : true  // parse XFBML
        });

        // Additional initialization code here
      };

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

    </script>

И это как я использую XFBML.parse 

 $(".fblike").each(function(){
  FB.XFBML.parse($(this).get(0));
  //because having multiple likes button on same page.
});

А вот моя кнопка like 

 <div class='fblike'><fb:like send='false' layout='button_count' width='100' show-faces='false' href='www.myurl.com?ref=facebook' ></fb:like></div>

Как заставить его работать с IE8 и IE9? Где я ошибаюсь и как исправить эту проблему?

С уважением,

2 2
facebook facebook-javascript-sdk

2 ответа:

По моему опыту, если вы попытаетесь запустить FB.XFBML.parse(), завернутый в то, что скрыто перед этим вызовом, он не будет работать на IE и Firefox.

Это не сработает: 

<div id="wrapper" style="display:none">
    <fb:like id="like_button" ... ...></fb:like>
</div>

<script>
FB.XFBML.parse(document.getElementById('like_button'), function() {
    $('#wrapper').show();
});
</script>

Можно было бы использовать что-то вроде этого: 

<div id="wrapper" style="display:block; height:0px; overflow:hidden;">
    <fb:like id="like_button" ... ...></fb:like>
</div>

<script>
FB.XFBML.parse(document.getElementById('like_button'), function() {
    $('#wrapper').animate({height:'30px'}, 300) 
});
</script>

Надеюсь, что это помогает кто-то другой.

6

Это работает для меня на всех браузерах (проверено на IE6+, Chrome, FF, Opera, Safari).

Вместо отображения скрытой кнопки FB Я динамически добавляю HTML-код кнопки FB в оболочку DIV, где я хочу, чтобы он отображался: 

<div id="fbWrapper"></div>

<script>
    $("#fbWrapper").append("<div class='fblike'><fb:like send='false' layout='button_count' width='100' show-faces='false' href='www.myurl.com?ref=facebook' ></fb:like></div>");
    FB.XFBML.parse($("#fbWrapper").get(0));
</script>

Или, если вы хотите показать кнопку FB внутри ранее скрытой панели, сначала сделайте панель видимой, а затем добавьте HTML-код кнопки FB: 

<div id="myPanel" style="display: none">
    Follow us on Facebook:
    <div id="fbWrapper"></div>
</div>

<script>
    $("myPanel").show();
    $("#fbWrapper").append("<div class='fblike'><fb:like send='false' layout='button_count' width='100' show-faces='false' href='www.myurl.com?ref=facebook' ></fb:like></div>");
    FB.XFBML.parse($("#fbWrapper").get(0));
</script>
1