AddThis按钮不会更新以包含片段（#Hash标签） [英] AddThis buttons wont update to include fragment (#Hash Tag)

问题描述

我的网站上有这些AddThis按钮，我的网站使用JS，通过图像库来访问用户，当更改图像时，URL被更新为片段元素中的图像标题，我遇到的问题是没有反映在AddThis链接中。我已经尝试从AddThis论坛获得一些答案，但指出api文档和addthis.toolbox（）函数，但它似乎没有为我工作，所以我以为我会运行它过去这里的专家。

这是基本页面上的AddThis代码。

  ;！ -  AddThis Button BEGIN  - > 
< div class =addthis_toolbox addthis_default_style addthis_32x32_style> 
< a class =addthis_button_preferred_1 add_this_but>< / a> 
< a class =addthis_button_preferred_2 add_this_but>< / a> 
< a class =addthis_button_preferred_3 add_this_but>< / a> 
< a class =addthis_button_preferred_4 add_this_but>< / a> 
< a class =addthis_button_compact add_this_but>< / a> 
< a class =addthis_counter addthis_bubble_style>< / a> 
< / div> 
< script type =text / javascript> var addthis_config = {data_track_clickback：false};< / script> 
< script type =text / javascriptsrc =http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4e77111e2de880eb>< / script> 
 
<！ -  AddThis Button END  - > 
  

在我的JS脚本中，当用户更改图像时，我已将其添加到该功能。 p>

  addthis.toolbox（。addthis_toolbox）; 
  

我也试过这个

  addthis.toolbox（）; 
  

运行代码时，我没有收到JS错误，但是我看不到AddThis按钮的任何更新。

您可以在这里看到问题。

http://www.martynazoltaszek.com/artpages?nid=30#Rendezvouz

此链接将打开一个名为Rendezvouz的特定图像的网站，但是nid = 30实际上是一个名为走过的不一致的图像。AddThis（Facebook）将显示问题将始终链接到图像。AddThis Gmail似乎是确定的，但我不认为这是API的一个因素，因为它适用于或不使用上述函数调用。

提前感谢。

ps使用标签GET变量和片段的原因是由于php页面加载和JS查看（没有页面参照），但这也支持一个非JS浏览器。

解决方案

我有一个类似的问题，而使用hashbangs为JavaScript驱动的网站。分享按钮不会内容加载异步时重新渲染。你应该能够采取这一切适合你的情况。也许只是 addthis.update（）代码

首先我将addThis的脚本改为async

  http://s7.addthis.com/js/250/addthis_widget.js#async=1 
  

DOM加载完毕后，可以收听哈希表，这是我们更新addthis分享详细信息的地方。

您可能需要额外的插件才能使用旧版浏览器，请考虑使用jQuery hashchange事件 - v1.3 - 7/21/2010 - http://benalman.com/projects/jquery-hashchange-plugin/

现在它的所有的连线都是一个hashchange，下一步是改变addThis。

  $（function（）{
 $ （window）.hashchange（function（）{
 if（$（'body'）。hasClass（'addThis'））{
 addthis.ost = 0; 
 addthis.update（'分享'，'url'，window.location.href）; //新的ur l 
 addthis.update（'share'，'title'，window.document.title）; //新标题。 
 addthis.ready（）; //这将重新渲染按钮。 
} 
 else {
 addthis.init（）; 
 $（'body'）。addClass（'addThis'）; 
} 
}）; 
 addthis.init（）//当我们将addthis更改为异步时，一旦DOM加载，您将不得不调用addthis.init（）。 
}）; 
  

希望这有帮助。

I have these AddThis buttons on my website, and my site uses JS to take a user though an image gallery, when changing an image the URL is updated with the image title in the fragment element, the problem I have is this is not being reflected in the AddThis links. I've tried to get some answers from the AddThis forums, but was pointed at the api documentation and the addthis.toolbox() function, but it doesn't seem to be working out for me, so I thought I'd run it past the experts here.

This is my AddThis code on the basic page.

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_preferred_1 add_this_but"></a>
<a class="addthis_button_preferred_2 add_this_but"></a>
<a class="addthis_button_preferred_3 add_this_but"></a>
<a class="addthis_button_preferred_4 add_this_but"></a>
<a class="addthis_button_compact add_this_but"></a>
<a class="addthis_counter addthis_bubble_style"></a>
</div>
<script type="text/javascript">var addthis_config = {"data_track_clickback":false};</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=ra-4e77111e2de880eb"></script>

<!-- AddThis Button END -->

In my JS script when a user changes the image, I have added this to the function.

addthis.toolbox(".addthis_toolbox");

I've also tried this

addthis.toolbox();

When running the code, I get no JS errors, but I dont see any updates to the AddThis buttons.

you can see the problem here.

http://www.martynazoltaszek.com/artpages?nid=30#Rendezvouz

This link will open up the site on a particular image called "Rendezvouz" but the nid=30 is actually a differnet image called "Walking by".The problem is shown by AddThis (Facebook) will always link to the Walking by" image. AddThis Gmail appears to be ok, but I dont think this is a factor of the API, as it works with or without the above function call.

Thanks in advance.

p.s. The reason for using a ?nid GET variable and a Fragment are due to php page load and JS viewing(without page refersh), but this also leaves support for a non JS browser.

解决方案

I had a similar issue whilst using hashbangs for a javascript driven site. This code was used because the share buttons wouldn't re-render when content is loaded async. You should be able to take parts of this to fit to your situation. Maybe just the addthis.update() code

First I changed the script for addThis to async

http://s7.addthis.com/js/250/addthis_widget.js#async=1

Once the DOM has loaded, listen for hashchanges, this is where we will update the addthis share details.

You may require additional plugins for this bit to work with older browsers, consider jQuery hashchange event - v1.3 - 7/21/2010 - http://benalman.com/projects/jquery-hashchange-plugin/

Now its all wired up for a hashchange, the next step is to alter addThis.

    $(function(){
        $(window).hashchange(function(){
            if($('body').hasClass('addThis')){
                addthis.ost = 0;
                addthis.update('share', 'url', window.location.href); // new url
                addthis.update('share', 'title', window.document.title); // new title.
                addthis.ready(); // this will re-render the buttons.
            }
            else {
                addthis.init();
                $('body').addClass('addThis');
            }
        });
        addthis.init() //As we've changed the addthis to async, you will have to call addthis.init() once the DOM has loaded.
    });

Hope this helps.

这篇关于AddThis按钮不会更新以包含片段（#Hash标签）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！