AddThis button will not work inside AJAX, but will work normally

后端 未结 8 717
温柔的废话
温柔的废话 2021-02-04 17:47

Basically, this is what I\'m doing. User visits site, loads \"index.html\" Within index.html, it automatically loads, through AJAX, \"details.html\" into a DIV. I put an ADDTHIS

相关标签:
8条回答
  • 2021-02-04 17:55

    Is details.html a fully compliant page on it's own? HTML, BODY, HEAD tags, etc?

    If so, I think things can get kind screwy when you try to load it into another page. I would either change details.html to just include the barebones markup that you need - or - if you need it to still be individually accessible - you could use jQuery to strip out the needed bits after the ajax call and only inject that portion.

    Details.html

    <html>
    <head>
    </head>
    <body>
        <div id="details">
        The needy bits.......
        </div>
    </body>
    </html>
    

    Index.html

    $("#targetDivID").load("detail.html #details");
    
    0 讨论(0)
  • 2021-02-04 17:58

    if i understand your question correctly, in the callback of the ajax function, bind the roll-over to the add-this button.

     $.ajax({
       type: "POST",
       url: "some.php",
       data: "name=John&location=Boston",
       success: function(){
         $('.addthis_button').hover(
           function(){
             //do mouse over
           },function(){
             //do mouse out
         });
       }
     });
    

    you can also try

    $('.addthis_button').live('mouseover',function(){//do mouseover});
    $('.addthis_button').live('mouseout',function(){//do mouseout});
    

    i've never used live, but it seems like it would work for you since your add_this button's get created after the $(document).ready()

    0 讨论(0)
  • 2021-02-04 18:02

    I recently ran in to issues with using AddThis on an all AJAX site and was able to come up with a couple of solutions for this issue.

    It turns out there is a variable that you can pass when loading the AJAX script as well as a way to re-initialize the script if the DOM is reloaded via AJAX. I have posted the full solution in detail on my blog here:

    http://joecurlee.com/2010/01/21/how-to-use-addthis-with-ajax-and-overflowauto/

    To briefly summarize, the solution is loading AddThis with the variable domready=1 appended, and re-initializing the script by deleting the initial load and then reloading the script dynamically:

    var script = 'http://s7.addthis.com/js/250/addthis_widget.js#domready=1';
    if (window.addthis){
        window.addthis = null;
    }
    $.getScript( script );
    
    0 讨论(0)
  • 2021-02-04 18:04

    addthis.toolbox(".addthis_toolbox");

    0 讨论(0)
  • 2021-02-04 18:13

    It seems like the script is calling the onLoad event of javascript and using this ajax call won't actually trigger that event. You could try other "share this" widget?

    Like http://sharethis.com/#STS=g12m3ugh.21zb or pre-load that button?

    Can you post a little bit more of the story on what are you doing?

    0 讨论(0)
  • 2021-02-04 18:13

    Add this snippet of .js to the .html you are loading. Replace "#atbutton" with your button's selector.

    addthis.button("#atbutton");
    0 讨论(0)
提交回复
热议问题