Question

您好，我在网上使用Facebook按钮。我的所有内容都是通过ajax加载的，我已经知道如果你想使用带有ajax加载内容的facebook类按钮，你应该使用FB.XFBML.parse()。我已经使用过它并且运行良好是firefox和chrome但它在IE中不起作用。我正在检查IE 8。我搜索了解决方案，发现here在我的html标记中添加了xmlns:fb="http://www.facebook.com/2008/fbml"。我做了但是还没修好。我的代码看起来像

  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一起使用？我错在哪里以及如何解决这个问题？

此致

Answer 1

根据我的经验，如果您尝试在此调用之前运行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>

希望这有助于其他人。

Answer 2

这适用于所有浏览器（在IE6 +，Chrome，FF，Opera，Safari上测试）。

我没有显示隐藏的FB按钮，而是动态地将FB按钮HTML代码附加到我希望它显示的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按钮，首先使面板可见，然后附加FB按钮HTML代码：

<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>

FB.XFBML.parse无法在IE中运行

2 个答案: