facebook 'like' button for facebook page but with callback

Question

I want to use the facebook like button for a facebook fan page, but with a callback function.

So far I've only managed to get the callback function to work with a facebook app with the following code-

<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
    FB.init({
        appId  : 'appID',
        status : true, // check login status
        cookie : true, // enable cookies to allow the server to access the session
        xfbml  : true, // parse XFBML
        channelUrl : 'http://www.my_url.com/channel.html', // channel.html file
        oauth  : true // enable OAuth 2.0
    });
</script>

<script>(function(d, s, id) {
   var js, fjs = d.getElementsByTagName(s)[0];
   if (d.getElementById(id)) return;
   js = d.createElement(s); js.id = id;
   js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
   fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
FB.Event.subscribe('edge.create', function(href, widget) {
    callbackFunction();
});
</script>

Like I said, the above code works fine for a facebook app. But what I really want to do is bind code similar to this, but to a facebook page 'like' button such as the following-

<div class="fb-like-box" data-href="https://www.facebook.com/{page-name}" data-width="292" data-height="250"  data-show-faces="true" data-stream="true" data-header="true"></div>

Does anyone know of a way to achieve this?

Many thanks in advance.

Answer 1

I had capture a click on the laik of <div class = "fb-like-box" ... html5 diva. Variant:

FB.Event.subscribe ('edge.create', function (response) {
     alert ('You just liked' + response);
});

You can only use in version XFBML of the like button,

but I had a very, and has decided in the end this variant

<div id="fb-root"></div>

<script>
     window.fbAsyncInit = function() {
 FB.init({appId: 'YOUR_FACEBOOK_APP_ID', status: true, cookie: true, xfbml: true});
 FB.Event.subscribe('edge.create', function(response) {
 alert('You just liked '+response);
 });
};
(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/ru_RU/all.js#xfbml=1&appId=265929413447804";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

</script>

<div class="fbp-one" style="margin-top: 62px;
                                margin-left: 60px;
                                position: absolute;
                                z-index: 1000;
                                height: 27px;
                                background-color: white;">
            <div class="fb-like" data-send="false" data-layout="button_count" data-width="100" data-height="200" data-show-faces="false"></div>
</div>
<div class="fbp-two" style="position:relative;">
            <div class="fb-like-box" data-href="YOUR_ADRESS" data-width="190" data-show-faces="true" data-stream="false" data-header="true"></div>
</div>

Div 'FBP-one' getting better on the button in the FBP-two above and looks like one unit and functional works in all browsers, just paint CSS, each for himself :)