Question

是否有人能够在Chrome扩展程序中使用Facebook Like，Twitter Follow和Google +1按钮。

我可以显示按钮以及一些功能，但似乎缺少部件。例如，Like按钮不记得你是否喜欢它，它每次都显示1的计数。 Twitter没有显示正确数量的关注者，并且在“关注”文本后缺少@username。

我知道扩展程序是沙箱。有没有人找到解决方法？例？码？

更新

问题是社交媒体按钮位于隐藏的div内（显示：无）。 div使用jQuery的slideToggle来显示和隐藏。默认情况下，div未显示，社交媒体按钮位于其上。当我将社交媒体按钮放在一个没有隐藏的div中时，它们可以正常工作。任何解决方案？

问题在于社交媒体按钮位于隐藏的div内（可以通过选项卡访问的不同显示）。有没有办法让它们工作而不更新触发事件的z-index？

Answer 1

他们在扩展页面中工作。您必须明确指定公共URL，并且必须修改facebook / twitter以明确包含协议。 //platform.twitter.com至https://platform.twitter.com

<强> popup.html

<html>
<body>
  <a href="https://twitter.com/twitter" class="twitter-follow-button" data-show-count="false">Follow @twitter</a>
  <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

  <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 = "https://connect.facebook.net/en_US/all.js#xfbml=1&appId=113869198637480";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>
  <div class="fb-like" data-href="http://example.com" data-send="false" data-layout="button_count" data-width="250" data-show-faces="false"></div>

  <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
  <g:plusone href='http://example.com'></g:plusone>
</body>
</html>

<强>的manifest.json

{
  "name": "test",
  "version": "1",
  "browser_action": {
    "default_popup": "popup.html"
  }
}

Answer 2

问题解决了。我将标记添加到标记页面，并在slideToggle开始后立即对API脚本进行匿名函数调用。效果很好。

隐藏Div内的社交媒体按钮

2 个答案: