1

jQuery経由でtwitter共有ボタンをロードしたいdivがあります。ページの読み込み時にスクリプトが実行されると機能します。しかし、その後手動で実行すると、スクリプトがロードされていないようです。

オリジナルボタン:

<a href="https://twitter.com/share" class="twitter-share-button" data-via="givestreamuk">Tweet</a>
<script>!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");</script>

jQuery経由でボタン全体（リンクとスクリプト）を読み込もうとしましたが、うまくいきませんでした。リンクを取得しただけです。代わりに、次のようにスクリプトを DOM に挿入しようとしました。

ここに私のJSがあります：

var twitter = '<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://customer-url" data-via="givestreamuk" data-hashtags="socialgiving">Tweet</a>';
jQuery('#twitter_share').html(twitter);

var jstext = '!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");';

var script   = document.createElement("script");
script.type  = "text/javascript";
script.text  = jstext;
jQuery('#twitter_share').append(script);

ボタンが配置される私のDIV：

<div id="twitter_share"></div>

これは、ページの読み込み時にスクリプトが実行されたときに機能しますが、その後手動でリンクのみが div に表示されます。

このボタンを手動で DIV にロードし、スクリプトを実行してボタンを生成する方法を提案できますか?

4

2 に答える 2

2

プロジェクトでTurbolinks、PJAX、または他の同様の宝石を使用していますか？もしそうなら、このスレッドを参照してください：

https://github.com/rails/turbolinks/issues/25

そしてこれらの解決策：

http://www.blackfishweb.com/blog/asynchronously-loading-twitter-google-facebook-and-linkedin-buttons-and-widgets-ajax-bonus

http://reed.github.com/turbolinks-compatibility/facebook.html
于 2013-02-25T20:23:21.537 に答える
0

コンテンツを動的に挿入する場合は、最初のウィジェットのみが正しく読み込まれるため、Twitter スクリプトを変更する必要があります。

新しい Twitter ボタンの場合、ID を持つスクリプト タグがtwitter-wjs既に存在し、if(!d.getElementById(id))が返されfalseます。

Twitter Widget オブジェクトに新しい要素を強制的に検出させるには、elseステートメントを追加するだけです。if

<script>
!function(d,s,id)
{
    var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';

    if(!d.getElementById(id))
    {
       js=d.createElement(s);
       js.id=id;
       js.src=p+'://platform.twitter.com/widgets.js';
       js.parentNode.insertBefore(js,fjs);
    }
    else
    {
        twttr.widgets.load();
    }
}(document, 'script', 'twitter-wjs');
</script>

ソース: https://dev.twitter.com/web/javascript/initialization

于 2015-07-08T15:19:57.287 に答える