12

JavaScriptを使って動的にFB：LikeボタンのようなURLに変更したいのですが。

現在、タグのhref属性を変更することしかできませんでした（以下のコードを貼り付けました）。fb:likeしかし、単に変更するだけではhrefうまくいかないようです。おそらく、FB：Likeボタンを再起動する必要がありますが、これまでのところ、その方法がわかりません。

function update_share(container, url) {
  // update fb:like href value
  var container = container[0] || document.body;
  var button = container.getElementsByTagName('fb:like');
  button[0].setAttribute('href', url);
}
4

4 に答える 4

24

これは、FB iframeを使用せずにXFBMLタグでも機能し、AJAXの呼び出しのように複数のFBでも機能します。

XFBMLコード全体をJS/jQueryでラップし、以下に示すように解析する必要があります。

$('#like').html('<fb:like href="' + url + '" layout="button_count" show_faces="false" width="65" action="like" font="segoe ui" colorscheme="light" />');
if (typeof FB !== 'undefined') {
    FB.XFBML.parse(document.getElementById('like'));
}

HTMLコード：

<span id="like"></span>
于 2010-11-15T08:03:06.077 に答える
9

fb：likeオブジェクトの代わりに、次のようにHTMLにFBiframeを記述します。

<iframe id="face" name="face" src="http://www.facebook.com/plugins/like.php?href=http://www.google.fr&layout=button_count&show_faces=false&width=400&action=like&font=arial&colorscheme=light" allowtransparency="true" style="border: medium none; overflow: hidden; width: 400px; height: 21px;" frameborder="0"scrolling="no"></iframe>

そして今、あなたはこの関数でJavaScriptで変更することができます：

function setUrl(url)
{
    sUrl = url;
    url = "http://www.facebook.com/plugins/like.php?href="+sUrl+"&layout=button_count&show_faces=false&width=400&action=like&font=arial&colorscheme=light";
    document.getElementById('face').setAttribute('src', url);
    //alert("url : "+url);
}

srcを変更すると、FBiframeが更新されます。

于 2010-08-27T18:09:20.403 に答える
9

ソーシャルボタンを再開するには、次のコードを使用します。

//Facebook like
if(typeof(FB) !== 'undefined')
     FB.XFBML.parse(document.getElementById('fblike'));

//Google plus one
if(typeof(gapi) !== 'undefined') {
    gapi.plusone.render(document.getElementById('gplus'),{
        'href':location.href,
        'annotation':'bubble',
        'width': 90,
        'align': 'left',
        'size': 'medium'
    });
}

//Twitter tweet button
if(typeof(twttr) !== 'undefined') {
    $('.twitter-share-button').attr('data-url',location.href);
    twttr.widgets.load();
}

このようなhtmlコードで：

<div style="float:left;margin-top: 5px;width:80px;">
    <div id="gplus" class="g-plusone" data-size="medium"></div>
</div>
<div style="float:left;margin-top:5px;width:90px;">
    <a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>
</div>
<div style="float:left;margin-top:5px;width:80px;" id="fblike">
    <fb:like send="false" layout="button_count" width="100" show_faces="false"></fb:like>
</div>
于 2011-12-25T10:39:55.917 に答える
3

いくつかの選択肢があると思います...

  1. 要素を削除し、XFBMLの文字列を作成して追加してから、親オブジェクトをXFBML.parse呼び出しで解析します。

  2. 要素またはそのコンテナを削除し、を使用して実際のXFBMLオブジェクトをビルドおよび追加します。

  3. ビルドされたiframeコンテナは、親ページから（GETを使用して）同様のURLで渡されます。JSでクエリ文字列を取得できる場合は、実際のバックエンドを使用しなくてもこれを実行できます。次に、Facebook SDKを初期化する前にマークアップを作成すると、「いいね」ボタンが表示されます。Facebookはとにかくすべてのものをiframeするので、この方法は思ったほど不格好ではありません。これを試してみましたが、うまくいきました。

于 2010-05-06T07:07:35.433 に答える