Кнопка AddThis не будет работать внутри AJAX, но будет работать нормально

В основном, это то, что я делаю. Пользователь посещает сайт, загружает «index.html». Внутри index.html он автоматически загружает через AJAX «details.html» в DIV. Я поместил кнопку ADDTHIS на "details.html". Однако по какой-то причине перепрошивка не работает.

Когда я захожу в файл details.html в браузере, прокрутка работает. Я предполагаю, что это из-за AJAX?

<a class="addthis_button"  href="http://www.addthis.com/bookmark.php?v=250&amp;pub=xa-4adf7e45288f5b21">
<img src="http://s7.addthis.com/static/btn/sm-share-en.gif" width="83" height="16" alt="Bookmark and Share" style="border:0;margin-top:16px;"/></a>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pub=xa-4adf7e45288f5b21"></script>

javascript jquery ajax addthis
person TIMEX    schedule 21.10.2009    source источник

Ответы (8)


arrow_upward
2
arrow_downward

если я правильно понял ваш вопрос, в обратном вызове функции ajax привяжите прокрутку к кнопке «добавить эту».

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

Вы также можете попробовать

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

я никогда не использовал live, но кажется, что это сработает для вас, так как ваша кнопка add_this создается после $(document).ready()

person Brandon Henry    schedule 22.10.2009

arrow_upward
14
arrow_downward

Недавно я столкнулся с проблемами, связанными с использованием AddThis на полностью AJAX-сайте, и смог найти несколько решений этой проблемы.

Оказывается, есть переменная, которую вы можете передать при загрузке сценария AJAX, а также способ повторной инициализации сценария, если DOM перезагружается через AJAX. Я подробно разместил полное решение в своем блоге здесь:

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

Подводя итог, можно сказать, что решение загружает AddThis с добавленной переменной domready=1 и повторно инициализирует скрипт, удаляя первоначальную загрузку, а затем динамически перезагружая скрипт:

var script = 'http://s7.addthis.com/js/250/addthis_widget.js#domready=1';
if (window.addthis){
    window.addthis = null;
}
$.getScript( script );
person Community    schedule 24.01.2010
comment
Просто отмечу, что для меня это решение не сработало. Мне пришлось сделать обратный вызов в .getScript(), который запускал addthis.init(), чтобы кнопка появилась. - person Nucleon; 25.10.2011
comment
Это было в основном для меня. Однако была необходима очистка некоторых дополнительных переменных, как описано здесь: stackoverflow.com/questions/9650226/ - person joaerl; 04.02.2013

arrow_upward
5
arrow_downward

addthis.toolbox(".addthis_toolbox");

person Mahmoud Khaled    schedule 28.04.2013

arrow_upward
2
arrow_downward

Столкнулся с той же проблемой, и это решило ее для меня во всех основных браузерах (IE6+, FF, Safari в MAC/XP):

http://joecurlee.com/2010/01/21/how-to-use-addthis-with-ajax-and-overflowauto/comment-page-1/#comment-24

person Marco    schedule 15.03.2010

arrow_upward
1
arrow_downward

У меня такая же проблема. Исправлено с помощью следующего кода. Я надеюсь, что это исправит это и для вас.

Исходный метод:

    var script = 'http://s7.addthis.com/js/300/addthis_widget.js?domready=1';
    if (window.addthis){
        window.addthis = null;
    }
    $.getScript( script );

Новый метод:

<script>
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);
</script>

В AJAX REQUEST вы можете использовать следующее: -

$.ajax({
    url:Url,
    type: 'POST',
    cache: false,
    success: function(res){
        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);
        // your custom code
    }
});
person Vishal Thakur    schedule 28.05.2020

arrow_upward
0
arrow_downward

Похоже, что скрипт вызывает событие onLoad javascript, и использование этого ajax-вызова фактически не вызывает это событие. Вы могли бы попробовать другой виджет "поделиться этим"?

Нравится http://sharethis.com/#STS=g12m3ugh.21zb или предварительно загрузить эта кнопка?

Можете ли вы опубликовать немного больше истории о том, что вы делаете?

person DFectuoso    schedule 21.10.2009

arrow_upward
0
arrow_downward

Является ли details.html полностью совместимой страницей? Теги HTML, BODY, HEAD и т. д.?

Если это так, я думаю, что все может стать немного странным, когда вы пытаетесь загрузить его на другую страницу. Я бы либо изменил details.html, чтобы просто включить разметку barebones, которая вам нужна, либо, если вам нужно, чтобы она по-прежнему была индивидуально доступна, вы могли бы использовать jQuery, чтобы удалить необходимые биты после вызова ajax и ввести только эту часть.

Детали.html

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

Индекс.html

$("#targetDivID").load("detail.html #details");
person WesleyJohnson    schedule 21.10.2009

arrow_upward
0
arrow_downward

Добавьте этот фрагмент .js в загружаемый .html. Замените «#atbutton» на селектор вашей кнопки.

addthis.button("#atbutton");
person Shaun Santa Cruz    schedule 17.11.2009