添加这在ajax加载后无法正常工作

Question

I have the AddThis js for bookmarking the details to the calender.This is working correctly on page load,but I do some filtering using ajax load and replace the html, after this the AddThis button not showing.here is my code for ajax .

$('document').ready(function () {

    $('.eventSelect').change(function () {
       var selectedDate = $('#eventDate').val();
        var keyword = $('#eventsearch').val();
        var url = "/EventsHome?eventDate=" + selectedDate + "&keyword=" + keyword;
       $.ajax({
           type: "GET"
          , url: url
          , success: function (data) {
              console.log($(data).find(".eventList").html());
              $(".eventList").html($(data).find(".eventList").html());
             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);

             }
          , error: function (XMLHttpRequest, textStatus, errorThrown) {

          }, comeplete: 

Answer 1

Use this script when you load new content:

if(typeof addthis !== 'undefined') { addthis.layers.refresh(); }

It is only solution for addthis_inline_share_toolbox !

addthis.toolbox() works only when you have specified buttons inside addthis element (mostly older versions).

Answer 2

After 1 hour of trying custom codes i found this one that works perfect.

$(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");
});

This is the source

Answer 3

You shouldn't need to reset the AddThis variables and reload the script, if you simply call:

addthis.toolbox();

this should re-render the buttons according to whatever configuration you have specified. Take a look at the documentation here:

http://support.addthis.com/customer/portal/articles/1293805-using-addthis-asynchronously#.UvvWw0JdWTM

Answer 4

Would have added this as a comment to Sol's answer , but I lack the rep. The actual syntax for reloading the toolbox is to pass in the class selector for the toolbox, however this assumes that you have already init'ed addthis

 addthis.toolbox('.addthis_toolbox')

Answer 5

You can use live method.

With jQuery 1.4.2 $('.eventSelect').live('change', function(){ works with FF, Safari, Opera, but not for IE

Answer 6

Gary's answer did it for me: https://stackoverflow.com/a/21176470/3656694

Then running addthis.toolbox('.addthis_toolbox') re-initialized addthis for me.

Hope this helps someone! :)

Answer 7

In order to work with ajax load and/or multiple addthis instances on the same page you need to insert the elements inside the div:

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

and then after your ajax is done run addthis.toolbox('.addthis_toolbox')

Answer 8

If you are using the AddThis share buttons, you might have noticed that once you initialize it on page load, it does not really work for content that is loaded via ajax after the fact.

ie AddThis is unaware of fresly loaded content. The fix for this is pretty simple. Just ask AddThis to refresh as follows, and it will automatically regenerate the correct share links for newly loaded content

addthis.layers.refresh();

Answer 9

I realized that my adblocker was responsible for

if(typeof addthis !== 'undefined') { addthis.layers.refresh(); }

not working. (addthis.layers.refresh was undefined.) This is strange since I have the exact same code on 4 sites, but only on the one it doesn't work. So if you are having problems, try turning off your adblocker to see if anything changes.

The code Alex posted worked for me when I had my adblocker turned on (uBlock origin). I decided to run it as follows, so that I do it the "right" way and only if it won't work, then run the alternative way.

if (typeof addthis !== 'undefined') {
    if (typeof addthis.layers.refresh !== 'undefined' && $.isFunction(addthis.layers.refresh)) {
        addthis.layers.refresh();
    } else {
        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/YOURLINK");
    }
}

Answer 10

i resolve this! Link of Documentation

 addthis_share.title = 'title of shared object'; addthis_share.url = 'URL to share'; addthis_share.description = 'description of shared'; addthis_share.swfurl ='URL of a Flash object to share, along with the link'; addthis_share.width ='ideal width of any provided Flash object'; addthis_share.height ='ideal height of any provide Flash object'; addthis_share.email_template ='name of template to use for emailed shares '; addthis_share.email_vars ='associative array mapping custom email variables to values '; 

 <script type="text/javascript"> var addthis_share = addthis_share||{ url_transforms : { clean: true } }; </script> <script type="text/javascript" src="https://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4e9c308d658c185a&async=1"></script>