ユーザーがボタン (「生成」) をクリックして、json ファイルから取得したテキストを使用してランダムなフレーズを動的に生成するページがあります。フレーズは div (#generated) に配置され、以前 (ボタンがクリックされる前) にあったものを置き換えます。フレーズの生成は完璧に機能します。ここで追加したいのは、ユーザーがツイート ボタンをクリックしてそのフレーズを共有する方法です。
ツイートボタンのコードは次のとおりです。
<div id="tweet_button">
<a href="http://twitter.com/share"
class="twitter-share-button"
data-text="This is what we want to change dynamically"
data-count="none">Tweet</a></div>
さらにヘッダーにこれを追加します：
<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="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
これdata-textは、ボタンが押された後に div のコンテンツを使用してツイートしようとしているものです。これが私の問題です：
まず、これを試してみてください：
$(document).ready(function(){
$.getScript('http://platform.twitter.com/widgets.js');
$('a[data-text]').each(function(){
$(this).attr('data-text', $('#generated').text() );
});
});
もちろん、data-text「これは動的に変更したいものです」から「生成」ボタンが押される前にdivにあったもの（つまり、ドキュメントの準備ができたときにそこにあったもの）への変更は、私が望むものではありません. したがって、このコードを使用しdata-textて、div の新しく生成されたコンテンツに変更できると考えました。
$("generate").click(function() {
setTimeout(function(){
$.getScript('http://platform.twitter.com/widgets.js');
$('a[data-text]').each(function(){
$(this).attr('data-text', $('#generated').text() );
});
},
1000);
});
私の考えでは、これは「生成」ボタンがクリックされるまで待機し、(div コンテンツが変更されたことを確認するために) 1 秒間遅延してから、divdata-textの新しいコンテンツで を更新します。もちろん、これはうまくいきません。
理想的にはdata-text、「生成」ボタンがクリックされるたびに更新されます。これ（ https://dev.twitter.com/discussions/890 ）の部分を行う方法があるようですが、今のところ、上記の最初の部分だけが心配です。
これが理にかなっていることを願っています...実際にこれを行う方法はありますか? この完全な新人のサポートに感謝します。