ダリの雑記:WEBプログラム版

「いいね!」ボタンが押されたとき、スクリプトを実行させる方法【Facebook・Javascript】

メモ。

「いいね!」ボタンが押された瞬間、こちらが用意しているスクリプト(javascript)を実行させたい!

という案件があったため、ググっていると下記のサイトを見つけました。

Facebookのいいねボタンを押した時に自分で用意したjsのメソッドを呼び出す - jsdo.it - Share JavaScript, HTML5 and CSS

 

注意点として、「いいね!」ボタンのコードは「XFBML」で記述する必要があります。(iframeじゃ多分ダメ。)「いいね!」ボタンのコード取得はこちら

また、jQueryも読み込んでおく必要が有ります。jQueryのダウンロードはこちら

 

「いいね!」ボタンを設置したページに以下のようなスクリプトを埋め込みます。

■スクリプト(javascript)の例

[javascript]

if (window.attachEvent) {
window.attachEvent("onload", initFunc);
}else{
window.addEventListener("load", initFunc, false);
}

function initFunc(){
timerID = setInterval(function () {
if ($('.fb_edge_comment_widget.fb_iframe_widget:visible').length) {
~実行させたいプログラムをここに記述~
clearInterval(timerID);
};
}, 200);
}

[/javascript]

01~04行:ページが読み込まれたら「initFunc()」関数を実行します。

07~14行:setIntervalでインターバルタイマーを設定し、 $('.fb_edge_comment_widget.fb_iframe_widget')に変化がないか見張ります。
(いいね!ボタンの状態が変化すると、$('.fb_edge_comment_widget.fb_iframe_widget')の状態も変化するみたいです。)
変化があったら「~実行させたいプログラムをここに記述~」部分に記述されているスクリプトが実行されます。
最後に、clearIntervalでインターバルタイマーをクリアします。

■注意点

参考にさせていただいたサイトにも書いてありますが、上記の方法では押した瞬間にスクリプトを実行させることは可能ですが、再度ユーザが訪れたとき、そのユーザがすでに「いいね!」ボタンを押しているかどうかは、判断できません。

これを判断するにはFQLを使うか(動作未確認)、「いいね!」ボタンを押してくれたユーザのFacebookIDを取得し、データベースや外部ファイルに蓄積しておく、という方法が考えられます。

ユーザのFacebookIDを取得する方法はこちらのページをご参照ください。

※ここで言うFacebookIDというのはログイン時に使用するIDではなく、登録時に連番で割り当てられる番号のことを指します。

モバイルバージョンを終了