Встраивание кнопки «Поделиться» в Twitter (с JS и всем остальным) в шаблон «Усы» - PullRequest
Новая
       18

Встраивание кнопки «Поделиться» в Twitter (с JS и всем остальным) в шаблон «Усы»

2 голосов
/ 16 марта 2012

Как я могу встроить кнопку общего доступа Twitter (с JS и всем) в шаблон усов?

Проблема, с которой я столкнулся, заключается в том, что мое AJAX-приложение не перезагружает страницу, а просто переключает представления на основе шаблонов усов. Я заметил, что функциональность, предоставляемая widjets.js, просто не включается, потому что файлы JS загружаются только один раз за время существования приложения и ищет теги, украшенные тегом «twitter» в DOM_READY. Это, однако, полностью исключает случаи, когда HTML впоследствии визуализируется из шаблона.

Я знаю, что могу использовать необработанную гиперссылку в твиттере и настроить ее так, чтобы она выглядела как кнопка, но это слишком примитивно.

Ответы [ 2 ]

2 голосов
/ 17 октября 2012

Вот решение, которое сработало для меня, используя шаблон внутри моего HTML-файла:

social.js: 

$(function() {
  var socialFeeds = {
    twitter: {
      account: "your-twitter-account",
      script: function() {
        // twitter code goes here, minus the script tags
        !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");

        // in my case, I had to re-render the twitter button, see here:
        // http://stackoverflow.com/a/6536108/805003
        $.ajax({ url: 'http://platform.twitter.com/widgets.js', dataType: 'script', cache:true});
      }
    }
  }

  $.Mustache.addFromDom('social-template');
  $('#social').mustache('social-template', socialFeeds);
}

index.html:

    <script id="social-template" type="text/html">
      <div id='social'>
          <p>Twitter button:</p>

          <a href="https://twitter.com/share" class="twitter-share-button" data-via="{{twitter.account}}">Tweet</a>
          {{ twitter.script }}
      </div>
    </script>
0 голосов
/ 16 марта 2012

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

...