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

Я использую кнопки 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, которую я вызываю из флэш-памяти, передавая URL-адрес из флэш-памяти. Я поместил скрипт и все остальное в свой «всплывающий» 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();


person brybam    schedule 02.09.2011    source источник
comment
В коде опечатка, у вас есть "chann" и "chaan", вот почему это не работает, измените "chann" на "chaan" в заголовке, и это должно творить чудеса. Для записи Инструменты > Консоль Javacript в Chrome приведет вас к отладчику. Если вы зайдете туда перед изменением, у него должна быть ошибка «Uncaught ReferenceError: chann не определен».   -  person Cubed Eye    schedule 03.09.2011


Ответы (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();
    }
person Cubed Eye    schedule 02.09.2011
comment
Итак, вы говорите, что я бы просто создал классы span в html... Тогда я мог бы сделать это в моей функции, которая запускается из флэш-памяти... просто используйте stButtons.locateElements();, чтобы каким-то образом изменить URL/TITLE, когда функция побежал? Не могли бы вы показать мне, как это используется для изменения URL/названия? Извините, я неплохо разбираюсь в actionctipt. Очень новичок в javascript и ajax. Извиняюсь! - person brybam; 03.09.2011
comment
это то, что вы после? Это немного грубо. - person Cubed Eye; 03.09.2011
comment
круто, в этом есть смысл. Похоже, это именно то, что я пытаюсь сделать... но после теста это просто не работает. Я разместил некоторую информацию выше. Не могли бы вы взглянуть на редактирование? Большое спасибо! - person brybam; 03.09.2011