2

ページに google+ 1 ボタンをロードしようとしています。目標は、ajax を介してボタンのマークアップをページに挿入し、ボタンを呼び出してレンダリングすることです。

ページが最初にロードされたとき、ボタンは正常にレンダリングされます。この問題は、マークアップが /displaycode.php から取得された後、再度レンダリング呼び出しが行われたときに発生します。

<a href="javascript:void(0)" id="btn">REFRESH</a>
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
  {"parsetags": "explicit"}
</script>
<script type="text/javascript">
$(function() {
  $("#btn").click(function() {
        $('#live-preview').empty();
        $("#live-preview").load('/displaycode.php #code');
        gapi.plusone.go();
    return false;
  });
    gapi.plusone.go();
});
</script>
<div id="live-preview"><div id="code"><div class="g-plusone"></div></div></div>
</div>

問題のデモはhttp://32px.co/googleplusdemo.phpで見ることができます。事前に助けてくれてありがとう。

4

1 に答える 1

5

レンダリング方法

明示的なレンダリングを使用: https://developers.google.com/+/plugins/+1button/#example-explicit-render

gapi.plusone.render('live-preview')

それ以外の:

gapi.plusone.go();

"{"parsetags": "explicit"}" セットも必要です:

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
    {"parsetags": "explicit"}
</script>

編集

さらに、jQuery の読み込みが完了した後に render を呼び出す必要があります。したがって、要素は実際には DOM にあります。

$(function() {
    $("#btn").click(function(e) {
        e.preventDefault();
        $('#live-preview').empty(); // Not necessary 
        $("#live-preview").load('/displaycode.php #code', function() {
            gapi.plusone.render('live-preview');
        });
    });
    gapi.plusone.render('live-preview');
});
于 2012-05-08T09:03:19.967 に答える