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

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

9 голосов
/ 03 сентября 2011

я использую кнопки 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();

1 Ответ

15 голосов
/ 03 сентября 2011

Я использую 

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