google-plus - plusone.js 有时在 chrome 上是 "pending"？

Question

有时，当我尝试使用 Chrome (22.0....) 时:

<script src="http://apis.google.com/js/plusone.js" type="text/javascript"></script>

它失败了。我的意思是，如果我检查网络控制台，它会显示“Pending...”，并且我的 .load() 事件被卡住了。

为什么？我该如何解决？

也试过:

<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>

但它是一样的...

Answer 1

我在您链接的页面的源代码中的任何地方都没有看到为 +1 按钮定义的 HTML 容器。我在页面上看到了您引用的第一个脚本，但您的页面似乎丢失了:

<!-- Place this tag where you want the +1 button to render. -->
<div class="g-plusone" data-annotation="inline" data-width="300"></div>

第二个脚本片段用于异步加载(首选)，您引用的脚本还需要您插入相同类型的 HTML 容器。

您可以使用 +1 button configuration tool 生成要包含在页面中的代码.

[更新]g-plusone 元素显然是由 jQuery 动态注入(inject)的，jQuery 的加载时间与 +1 按钮自己的加载处理程序不同，这解释了为什么有时它可能会显示。在这种情况下，您需要使用 parseTags: 显式选项:

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
  {parsetags: 'explicit'}
</script>

然后在你自己的 JavaScript 注入(inject) g-plusone div 之后，你必须调用:

gapi.plusone.go();

这将在启动时显式呈现页面上的所有 +1 按钮。