在addthis共享栏上动态更改URL可以处理除共享计数以外的所有内容

Question

我在页面上有一个模态，在页脚中添加了共享按钮。 我有一个页面上的项目列表，点击后，通过ajax填充内容模式。

我正在做的是动态更改addthis：url和addthis：title on click。

所以，这里的模式被剥离到页脚：

<div class="modal">
  ...
  <div class="modal-footer">
    <div class="addthis_toolbox addthis_default_style">
      <a class="addthis_button_preferred_1"></a>
      <a class="addthis_button_preferred_2"></a>
      <a class="addthis_button_preferred_3"></a>
      <a class="addthis_button_preferred_4"></a>
      <a class="addthis_button_compact"></a>
      <a class="addthis_counter addthis_bubble_style"></a>
    </div>
  </div>
</div>

然后，当点击一个项目时，我传递了一些变量来更改网址和标题：

addthis.toolbox(".addthis_toolbox", null, { title: theTitle, url: theUrl });

问题是<a class="addthis_counter addthis_bubble_style"></a>

这是结束时的计数泡沫：

网址和标题改变得很好，但计数器永远不会改变。

我已经提交了一个支持请求来添加这个，其中缺少一个体面的响应，询问我是否已经调用了addthis.init（），这是肯定的...当然我做了。共享栏已初始化并正在运行，但计数不更新。

在这里搜索网络和其他问题，以及关于addthis的文档，有很多复杂的方法来处理基于ajax的内容。

我的代码与他们的例子的不同之处在于，ajax内容包括实际按钮，而我的代码没有。我的共享工具栏仍保留在页面上，只有addthis：url和addthis：title已更改。

也许我错过了一小步，或者这可能是一个错误，而不是我的错。

希望有人可能有一些见解。

修改

我最后得到了一个回复...来自addthis，声明这是不可能的。如果调用工具箱函数，则不会刷新计数。

但约瑟夫在下面的评论和答案中显示的解决方法现在解决了这个问题，至少在他们提供更合适的解决方案之前。

Answer 1

经过多次试验和错误，似乎addthis.counter方法是刷新计数器的方法。这个方法上的小文档似乎只是指使用没有任何参数的方法（forum post I found），它可以刷新静态共享元素的计数器（这是未经证实的）;但是，当您添加用于addthis.toolbox方法调用的相同属性时，它会正确刷新计数器。当您调用counter方法时，您必须为计数器而不是工具箱提供类。例如addthis.counter('.addthis_counter', null, { url: 'http://example.com'});官方文档可在此处找到：http://support.addthis.com/customer/portal/articles/1365325-rendering-tools-with-javascript

以下是摘要中的代码：

HTML

<!-- Go to www.addthis.com/dashboard to customize your tools -->
<div class="addthis_toolbox addthis_default_style">
    <a class="addthis_button_preferred_1"></a>
    <a class="addthis_button_preferred_2"></a>
    <a class="addthis_button_preferred_3"></a>
    <a class="addthis_button_preferred_4"></a>
    <a class="addthis_button_compact"></a>
    <a class="addthis_counter addthis_bubble_style"></a>
</div>
<input type="text" value="http://example.com">

的JavaScript

$(function(){
    addthis_config = addthis_config || { };
    addthis_config.pubid = prompt('Provide pubid:');
    addthis.init();

    $('input').on('input',function(){
        $(".addthis_toolbox .addthis_counter").replaceWith('<a class="addthis_counter addthis_bubble_style"></a>');
        addthis.toolbox(".addthis_toolbox", null, { title: 'test', url: this.value });
        addthis.counter('.addthis_counter', null, { url: this.value });
    }).trigger('input');
});

请注意，javascript会提示您输入您的pubid。这仅适用于演示，您可以将其更改为addthis_config.pubid = 'xx-xxxxxxxxxxxxxxxx';以用于您的应用程序。

演示

jsfiddle