添加这不适用于Ajax

时间:2012-03-10 21:12:11

标签: jquery ajax addthis

我正在使用Ajax加载所有文章,但Addthis功能不正确

 $thisChild.load( permLink + ' #thePostStuff', function() {

在所述.load()函数的回调中,我添加了此代码以引入Addthis共享功能:

var script = 'http://s7.addthis.com/js/300/addthis_widget.js?domready=1#pubid=MY-PUB-ID';
if (window.addthis){
    window.addthis = null;
}
$.getScript( script );

加载Addthis脚本的ajax请求调用的permLink文件内容中的代码如下:

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style addthis_32x32_style"
        addthis:url="<?php the_permalink(); ?>"
        addthis:title="<?php the_title(); ?>"
        addthis:description="<?php the_excerpt(); ?>"> 
    <a class="addthis_button_facebook"></a>
    <a class="addthis_button_twitter"></a>
    <a class="addthis_button_preferred_3"></a>
    <a class="addthis_button_compact"></a>
    <a class="addthis_counter addthis_bubble_style"></a>
</div>
<!-- AddThis Button END -->

问题是,addthis没有按预期加载。它在第一次打开文章时正常工作,但在任何其他时间(除非页面被刷新)它都不能包含显示文章共享次数的数字,当我检查元素时,它看起来像这样:{{ 1}}

编辑:

尝试了一个已知修复程序:<a class="addthis_button_expanded" target="_blank" title="View more services" href="#">1</a>但这并没有解决问题。

编辑2012年8月14日

该网站是http://epicvan.com,我刚刚删除了这些数字,因为我在处理这个问题时从来没有想过修复。该项目已于几个月前完成,因此我不会测试新的答案。希望如果您遇到同样的问题,他们可以帮助您!干杯

9 个答案:

答案 0 :(得分:33)

我遇到了同样的问题。修正了以下内容。希望能为你修复它。

原件:

    var script = 'http://s7.addthis.com/js/300/addthis_widget.js?domready=1#pubid=MY-PUB-ID';
if (window.addthis){
    window.addthis = null;
}
$.getScript( script );

新:

<script>
var script = 'http://s7.addthis.com/js/250/addthis_widget.js#domready=1';
if (window.addthis) {
    window.addthis = null;
    window._adr = null;
    window._atc = null;
    window._atd = null;
    window._ate = null;
    window._atr = null;
    window._atw = null;
}
$.getScript(script);
</script>

答案 1 :(得分:5)

我在这里写了一个非常详细的描述https://stackoverflow.com/a/16950881/1118070但是,要点是addthis.toolbox(".addthis_toolbox");是正确的解决方案,但是重要的是要注意每次应该调用它加载新的ajax内容。

<强> HTML

 <div class="addthis_toolbox addthis_default_style ">
    <a class="addthis_button_facebook" style="cursor:pointer"></a> 
    <a class="addthis_button_twitter" style="cursor:pointer"></a> 
    <a class="addthis_button_email" style="cursor:pointer"></a>
 </div>

<强>的javascript

// onload of the ajax content
addthis.toolbox('.addthis_toolbox'); 

另请注意,任何以iframe形式加载的内容(如facebook),如果它嵌套在'.addthis_toolbox'容器中,都会导致问题。我建议将它放在它自己的容器中,并在它们上面调用toolbox()方法。

有关详细信息,请参阅我的链接。

答案 2 :(得分:4)

尝试自定义代码1小时后,我发现这个代码完美无缺。

$(document).ajaxStop(function() {
  if (window.addthis) {
    window.addthis = null;
    window._adr = null;
    window._atc = null;
    window._atd = null;
    window._ate = null;
    window._atr = null;
    window._atw = null;
  }
  return $.getScript("http://s7.addthis.com/js/300/addthis_widget.js#pubid=sdive");
});

这是source

答案 3 :(得分:2)

请尝试通过此链接提供的解决方案

http://support.addthis.com/customer/portal/questions/399867-addthis-and-ajax-with-addthis-toolbox-

<script type="text/javascript">addthis.toolbox('.addthis_toolbox');</script>
        <script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=vijayk"></script>

因为我也面临同样的问题。但这可以通过上述方法得到解决。 希望这会有所帮助。

谢谢, 维杰

答案 4 :(得分:1)

addthis.toolbox(".addthis_toolbox");

答案 5 :(得分:1)

问题是在ajax调用中#pubid会丢失,所以AddThis不知道谁在拨打电话。

这对我有用:

<script>
$.getScript("https://s7.addthis.com/js/300/addthis_widget.js#pubid=YOUR-ID", function () {
    addthis_config = { pubid: 'YOUR-ID' };
    addthis.init();
});
</script>

在addthis.com的支持网站上找到了此问题的答案:http://support.addthis.com/customer/portal/questions/240144-email-template-when-using-ajax-bug-?t=89322

答案 6 :(得分:0)

我前几天看了这篇支持帖子,可能与你的问题有关: http://support.addthis.com/customer/portal/questions/240144-email-template-when-using-ajax-bug-?t=89322

如果我理解正确,他会描述在第一次共享后,小部件与您的个人资料断开连接,并且每个未来的共享(没有刷新)都不会被跟踪或任何事情。他的解决方案是单独声明 pubid 。 我不知道这是否有帮助,但我认为向你展示我在这个主题上找到的东西并不会有什么害处:)

答案 7 :(得分:0)

对于那些现在作为我来到这个问题的人, 对我有用的代码是:

<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=XXXXXXXXXXXXXXXXX"></script>
<script>
if (window.addthis) {
    // for others time force addthis to run again
    window.addthis.toolbox('.addthis_toolbox');
} else {
   // in the first time use autoload bu addthis
}
</script>

答案 8 :(得分:0)

在AJAX调用之后执行这行代码:

addthis.layers.refresh();

以下是AddThis

的设置

<强>脚本

<script type="text/javascript" 
        src="//s7.addthis.com/js/300/addthis_widget.js#pubid=<my_pub_id>">
</script>

我将此代码放在我希望AddThis显示

的位置
<div class="addthis_inline_share_toolbox_tvqk"></div>

我如何进行AJAX调用

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (this.readyState === 4 && this.status === 200) {

        // Update the DOM

        if (typeof(addthis) != 'undefined' && addthis != null) 
            addthis.layers.refresh();
    }
};
xhttp.open("POST", "<address_to_post_back_to>", true);
xhttp.send(<post_data>);

<强>结果

enter image description here