ボタンのようにFacebookにjavascript関数呼び出しを追加する

Question

ユーザーが自分のサイトでlikeボタンをクリックすると、Javascript関数を呼び出したいと思う。

ボタンのソースコードは次のとおりです。にレンダリングするブラウザでは、

<div class="fb-like" 
    data-href="http://www.example.com" 
    data-layout="button" 
    data-action="like" 
    data-size="large"> 
</div> 

：

$('.fb-like').click(function() { 
    alert("Handler for .click() called."); 
}); 

をしかし、それはdoesnの：

<div class="fb-like fb_iframe_widget" data-href="http://www.example.com" data-layout="button" data-action="like" data-size="large" fb-xfbml-state="rendered" fb-iframe-plugin-query="action=like&amp;app_id=&amp;container_width=892&amp;href=http%3A%2F%2Fwww.example.com%2Fm%2F174&amp;layout=button&amp;locale=en_US&amp;sdk=joey&amp;size=large"><span style="vertical-align: bottom; width: 63px; height: 28px;"><iframe name="fb56152a7ff1cc" width="1000px" height="1000px" frameborder="0" allowtransparency="true" allowfullscreen="true" scrolling="no" title="fb:like Facebook Social Plugin" src="https://www.facebook.com/v2.5/plugins/like.php?action=like&amp;app_id=&amp;channel=http%3A%2F%2Fstaticxx.facebook.com%2Fconnect%2Fxd_arbiter%2Fr%2FfTmIQU3LxvB.js%3Fversion%3D42%23cb%3Dfe277476c6182%26domain%3Dlocalhost%26origin%3Dhttp%253A%252F%252Flocalhost%253A8000%252Ff14aab39703836c%26relation%3Dparent.parent&amp;container_width=892&amp;href=http%3A%2F%2Fwww.example.com%2Fm%2F174&amp;layout=button&amp;locale=en_US&amp;sdk=joey&amp;size=large" style="border: none; visibility: visible; width: 63px; height: 28px;" class=""></iframe></span></div> 

私が試してみました仕事。私はFacebookがボタンを編集するために私が知らないいくつかの特別な保護を持っているのだろうか？

FB.Event.subscribe('edge.create', page_like_or_unlike_callback); 
FB.Event.subscribe('edge.remove', page_like_or_unlike_callback); 

出典：https://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/

あなたはそれらのサブスクリプションを置くことができます右FB.init後：

window.fbAsyncInit = function() { 
    //SDK loaded, initialize it 
    FB.init({ 
     appId  : 'your-app-id', 
     xfbml  : true, 
     version : 'v2.8' 
    }); 

    FB.Event.subscribe('edge.create', page_like_or_unlike_callback); 
}; 

それはあなたがedge.createイベントをサブスクライブする必要があり、どのように動作するかではありません

Answer 1

詳細：http://www.devils-heaven.com/facebook-javascript-sdk-login/

Answer 2

特別な保護はありません。これは通常のフレーム動作で、same-origin policyです。

<iframe ... src="https://www.facebook.com/v2.5/plugins/like.php?..." ...></iframe> 

そのiframe内部にユーザーがクリックすると、イベントが内部で消費されると：あなたは結果のDOM要素をチェックすると

、あなたはそれが私が次のように省略しているiframeを、作成していることがわかりますフレーム、およびイベントリスナーは起動しません。同じ起源のポリシーのため、異なる起源のイベントであるため、フレーム内のイベントをバインドすることはできません。

Facebook APIが提供するJavaScript APIを使用して、利用可能なイベントを聴く必要があります。