Addthis nie ładuje się na zawartość ajax

Question

Próbuję załadować przycisk addthis na dynamicznie ładowanej treści, ale mimo że skrypt jest załadowany, addthis nie wyświetla paska narzędzi.

jQuery(".somediv").html(response); // dynamically loaded content 
jQuery.getScript("//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-53a011f32e6cd338") 
    .done(function() { 
     addthis.init(); 
     addthis.toolbox('.addthis_sharing_toolbox'); 
    }) 

A poniżej jest zawartość html

<div class="addthis_sharing_toolbox"></div> 

Proszę o pomoc.

Answer 1

@amit Zmierzyłem się z tym samym problemem co ty. Po pewnych badaniach zrootowałem źródło tego problemu.

Jeśli dodany przycisk AddThis przez deskę rozdzielczą, istnieją pewne skróty html/js kody aby dodać je do swojej strony bardzo szybko:

<!-- Go to www.addthis.com/dashboard to customize your tools --> 
<div class="addthis_sharing_toolbox"></div> 

ale formalny sposób jak addthis api doc państw, aby dodać przyciski strona jest dla Ciebie jak:

<div class="addthis_toolbox" data-url="domain.com" data-title="title"> 
    <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> 

Tak więc, jeśli dodać następujące linie wewnątrz pudełka div klasy „addthis_sharing_toolbox”, to będzie w końcu działać.

<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> 

Answer 2

Krok 1: Umieść następujący kod do głównego szablonu, z którego można wywołać ajax a także wyświetlić dane wyjściowe:

<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=**YOUR-PUB-ID**" async="async"></script> 
//So that, we are inserting this AddThis JS source only for once; 

Krok 2: dynamikę (ajax) treść powinna zawierać następujące linie z inną treścią:

<div class="addthis_sharing_toolbox"> 
    <a class="addthis_button_email" style="cursor:pointer"></a> 
    <a class="addthis_button_facebook" style="cursor:pointer"></a> 
    <a class="addthis_button_twitter" style="cursor:pointer"></a> 
    <a class="addthis_button_linkedin" style="cursor:pointer"></a> 
</div> 

Step-3: Wreszcie po pomyślnym załadowaniu ajax uruchom następującą linię kodu z funkcją zwrotną;

addthis.toolbox('.addthis_sharing_toolbox'); 

Na przykład:

$.ajax({ 
    type: "GET", 
    url: MY_URL, 
    //...... 
    success: function(data){ 
     //...... 
     $("#MY-DIV").html(data); //THIS IS IMPORTANT TO INSERT THE DYNAMIC DATA INTO THE DOM BEFORE CALLING THE FOLLOWING TRIGGER; 
     addthis.toolbox('.addthis_sharing_toolbox'); 
    } 
});