FB.XFBML.parse не работает в IE

Привет, я использую кнопку "Мне нравится" на Facebook. Весь мой контент загружается через ajax, и я узнал, что если вы хотите использовать кнопку, похожую на Facebook, с загруженным 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.
});

И вот моя кнопка "Мне нравится"

 <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 ответа

Решение

По моему опыту, если вы попытаетесь запустить 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>

Надеюсь, это поможет кому-то еще.

Источник

Это работает для меня во всех браузерах (проверено на 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>
Источник
Другие вопросы по тегам