Как динамически создать "Поделиться кнопками" с помощью пользовательских URL-адресов с помощью функции JavaScript?

Question

Я использую кнопки http://sharethis.com/ чтобы предоставить пользователям на сайте простой способ делиться контентом.

У них есть информация о "пользовательских кнопках" здесь: http://help.sharethis.com/customization/custom-buttons

Похоже, чтобы указать URL, в примере все они имеют только HTML, как это:

<span class="st_sharethis" st_url="http://mycustomurl.com" st_title="Sharing Rocks!"
displayText="ShareThis"></span>

Но мне нужно иметь возможность динамически создавать кнопки на лету без перезагрузки страницы.

Итак, во флэш-приложении, которое я создаю, у меня есть "кнопка общего доступа", которая запускает функцию javascript на веб-странице, которая заставляет "всплывающий" div исчезать в центре экрана, который я хочу отобразить на кнопках общего доступа. В зависимости от того, на какую кнопку общего доступа кто-то нажимает, он должен иметь динамически созданный URL-адрес.

Важно, если они закроют диалоговое окно, а затем снова нажмут кнопку "Поделиться", надеясь, что код просто перезапишет старый код новыми кнопками, новыми URL-адресами / заголовками.

Итак, я создал эту функцию javascript, которую я вызываю из flash, одновременно передавая URL из flash. Я поместил скрипт и все внутри моего "всплывающего" div, надеясь, что кнопки будут отображаться внутри этого div.

function shareChannel(theurl)
{
//I cant seem to find an example of what to put here to load the buttons, and give them a custom URL and title

//finally display the popup after the buttons are made and setup.
displaypopup();
}

Может ли кто-нибудь опубликовать пример того, как я мог бы сделать это без перезагрузки страницы?

РЕДАКТИРОВАТЬ: @Cubed

<script type="text/javascript">
function shareChannel(chaan)
          {

          document.getElementById('spID1').setAttribute('st_url', 'http://mycustomurl?chan='+chaan);
          document.getElementById('spID1').setAttribute('st_title', 'Custom Title is ['+chann+'] it works!');

          stButtons.locateElements();

          centerPopupThree();
          loadPopupThree();
          }

</script>

В принципе ничего не происходит. Я ненавижу использовать JavaScript, потому что я действительно не знаю, как получить сообщения об ошибках или отладки. Когда я работаю с flex, у меня есть отличный отладчик / консоль, с которой можно обойтись. Итак, извините, у меня проблемы с предоставлением дополнительной информации. Я заметил, когда я удаляю только

document.getElementById('spID1').setAttribute('st_url', 'http://mycustomurl?chan='+chaan);
              document.getElementById('spID1').setAttribute('st_title', 'Custom Title is ['+chann+'] it works!');

Появится всплывающее окно.

Но если у меня есть код setAttribute выше в функции, всплывающее окно никогда не появляется, поэтому я предполагаю, что что-то в этом коде нарушает его. Какие-либо предложения? Или, по крайней мере, я мог бы использовать хром, чтобы сказать мне, в чем ошибка? Я попытался проверить консоль элемента, но там не было ничего, что появилось, когда я запустил функцию.

Кроме того, в верхней части моего кода они заставили меня использовать:

    <script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js">
</script><script type="text/javascript">stLight.options({publisher:'mypubidgoeshere'});</script>

Должен ли я использовать stLight.locateElements(); скорее, чем stButtons.locateElements();

Answer 1

Я использую

stButtons.locateElements();

функция для генерации любых новых кнопок после загрузки контента через AJAX, я думаю, это будет работать для этого тоже.

Этот вопрос может также помочь:

Поделиться этой кнопкой не работает на страницах, загруженных через ajax

Лучшее решение:

Сделай свой <div> и убедитесь, что все <span>У них есть идентификаторы, в противном случае вы можете дать им классы, но вам нужно будет перебрать их все.

function shareChannel(theurl, thetitle)
    {
    document.getElementById('spanID1').setAttribute('st_url', theurl);
    document.getElementById('spanID1').setAttribute('st_title', thetitle);

    stButtons.locateElements();

    //finally display the popup after the buttons are made and setup.
    displaypopup();
    }