社会图标不是无限滚动WordPress的工作(Social Icons not working wi

我们在做一个网站，在工作中的客户端，它可以在这里找到： http://ethercreative.net/studio_social/这是一个非常简单的wordpress主题，但并发症与无限滚动的插件之间的冲突引起的，与社会图标。

每个柱是指显示在与G +，FB和Twitter社会图标内末尾的块。它的目的是显示在〜4个开始帖左右，然后当滚动是指加载下一组。

每个这些工作上的事情，却不能在一起。

当无限滚动加载职位的下一个块，那只能说明像按钮Facebook的，既不的另外两个社会的图标。

但奇怪的是，虽然，它留下的代码块后面：

<span class="icons">
                    <g:plusone size="medium" href="http://ethercreative.net/studio_social/?p=1"></g:plusone>                <iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fethercreative.net%2Fstudio_social%2F%3Fp%3D1&amp;locale=&amp;layout=button_count&amp;action=like&amp;width=92&amp;height=20&amp;colorscheme=light" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:92px; height:20px;" allowtransparency="true"></iframe>&nbsp;&nbsp;&nbsp;
                    <a href="http://twitter.com/share" class="twitter-share-button" data-url="http://ethercreative.net/studio_social/?p=1" data-count="horizontal" data-text="Hello world!" data-via="twitter_username"></a></span>
</div>

我知道问题是什么，为什么它的发生，但我真的不是很好用JavaScript和不知道什么叫用来修复它。

我使用的WordPress 3.3.1，与无限滚动的插件（http://wordpress.org/extend/plugins/infinite-scroll/）和讯网的社会图标（http://wordpress.org/extend/plugins / Digg的-Digg的/）

无限滚动的插件确实有增加的onLoad事件已经抢到了一套新的职位后运行的能力。所以，我要在这里补充？

感谢您的任何和提前的所有帮助！祝你今天愉快。

更新：一些调查研究后，我有固定的Twitter了。现在，它只是谷歌加留解决。 Twitter的所需的代码是：

!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");

再次更新：发现了谷歌加代码太：

（函数（）{风险PO =使用document.createElement（ '脚本'）; po.type = '文本/ JavaScript的'; po.async = TRUE; po.src =“https://apis.google.com/js/ plusone.js ';变种S = document.getElementsByTagName（' 脚本“）[0]; s.parentNode.insertBefore（PO，S）;}）（）;

我学到了什么？要求对堆栈溢出之前做更多的谷歌搜索。至少继承人的答案的人这个问题在未来。

Answer 1:

基本上你所提出的解决方案是重新加载脚本，这是非常低效的，因为你有可能加载它们在页面加载的第一套社交按钮。该服务的所有3有一个方法来解析的一个部分，或整个文件提供任何新的社交小工具。你想会是这样的代码：

var el = document.body; 

//Google Plus   
if (typeof gapi !== "undefined") { gapi.plusone.go(el); }

//Facebook
if (typeof FB !== "undefined") { FB.XFBML.parse(el); }

//Twitter
if (typeof twttr !== "undefined") { twttr.widgets.load(); }

在上述情况下，厄尔尼诺应该是保存的小工具或可能只需document.body的是（将重新呈现所有部件。）不知道你是否能缩小目前与Twitter的背景下，集装箱，但我相信，他们计划增加那。

Answer 2:

像LocalPCGuy表明，你正在做的比需要更多的工作来实现这一目标。理想情况下，你就会有异步加载回调的部分做的工作，只是需要它们的元素嵌入到这些按钮。或者，甚至更好，添加它们在服务器端（如果可能的话），从而使客户端做任何工作，以使页面准备。至少在你的解决方案，该脚本文件将被缓存，应使加载时间更好。问题是，你仍然使页面更加努力地工作比它需要的。随着页面滚动无限和变得越来越大，这些额外的工作会越来越显著。

理想的流量会是这样的：

加载初始页面
执行所需的JS。在这一步中，请确保您有将嵌入在一个给定的DOM节点的社会小部件的功能。
让网页无限滚动，触发和异步请求
在异步加载，具有异步加载回调解析响应，然后遍历DOM每个条目它创建传递给你的widget制作功能。

这样一来，你在做最少的工作要求得到你想要的效果。

Answer 3:

添加代码的JS文件...

addthis.toolbox('.addthis_toolbox');
addthis.counter('.addthis_counter');

它完美的作品。

文章来源: Social Icons not working with Infinite Scrolling on Wordpress