javascript 使用 jQuery 捕获 Facebook 'Like' 按钮的点击
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11758197/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
capture click of Facebook 'Like' button with jQuery
提问by crmpicco
I am looking on the Facebook Developers Documentationto locate some sample code that would allow me to capture a click event on the "Like" button. It states:
我正在Facebook 开发人员文档中查找一些示例代码，这些代码可以让我捕获“喜欢”按钮上的点击事件。它指出：
If you are using the XFBML version of the button, you can subscribe to the 'edge.create' event through FB.Event.subscribe.
如果您使用的是 XFBML 版本的按钮，您可以通过 FB.Event.subscribe 订阅 'edge.create' 事件。
I am not using XFBML however, this is my code:
但是，我没有使用 XFBML，这是我的代码：
<div class="social_net_button facebook_button">
<div id="fb-root"></div>
<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_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
FB.Event.subscribe('edge.create',
function(response) {
alert('You liked the URL: ' + response);
}
);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="http://www.facebook.com/pages/Ayrshire-Minis/160330240663397" data-send="false" data-layout="button_count" data-width="70" data-show-faces="false" data-action="recommend"></div>
</div>
Can a click of the 'Like' button be captured by jQuery?
jQuery 可以捕获单击“喜欢”按钮吗？
采纳答案by crmpicco
The solution, it would appear, is sending the request asynchronously. This code below works when placed after my fb-likediv class:
看起来，解决方案是异步发送请求。下面的代码在我的fb-likediv 类之后放置时有效：
<script>
window.fbAsyncInit = function() {
FB.init({
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
};
</script>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.Event.subscribe('edge.create',
function(response) {
_gaq.push(['_trackSocial', 'facebook', 'like', document.location.href]);
}
);
};
</script>
回答by Robin Drexler
You could try this.
你可以试试这个。
Docs: http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/
文档：http: //developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/
FB.Event.subscribe('edge.create', function(response) {
console.log('clicked');
});?
I think this one only counts if user clicks AND it increaes the like count (logged in users only) Since I don't have an FB-Account I couldn't try it. Please tell me, if it works :)
我认为这个只有在用户点击时才有意义，并且它增加了喜欢计数（仅限登录用户）因为我没有 FB 帐户，所以我无法尝试。请告诉我，如果它有效:)
Update:
更新：
The FB object comes from the script you're already embedding.
FB 对象来自您已经嵌入的脚本。
回答by David Augustus
This code REALLY works :)
这段代码真的有效:)
<script type='text/javascript'>//<![CDATA[
window.addEvent('load', function() {
window.fbAsyncInit = function() {
FB.init({
appId: '42424242424242',
status: true,
cookie: true,
xfbml: true,
oauth: true
});
FB.Event.subscribe('edge.create', function(response) {
alert('You liked the URL: ' + response);
});
};
(function(d) {
var js, id = 'facebook-jssdk';
if (d.getElementById(id)) {
return;
}
js = d.createElement('script');
js.id = id;
js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
});//]]>
</script>
<div id="fb-root"></div>
<div class="box">
<p>First a Like Box of a facebook page</p>
<p class="info">edge.create is not called</p>
<div class="fb-like-box" data-href="http://www.facebook.com/jsfiddle" data-width="292" data-show-faces="true" data-stream="false" data-header="true"></div>
</div>
<div class="box">
<p>Like Button of a website</p>
<p class="info">here you can see the edge.create fire</p>
<div class="fb-like" data-href="http://jsfiddle.net" data-send="false" data-width="150" data-show-faces="true"></div>
</div>
<div class="box">
<p>Like Button of a Facebook Page</p>
<p class="info">here you can see the edge.create fire</p>
<div class="fb-like" data-href="http://www.facebook.com/jsfiddle" data-send="false" data-width="150" data-show-faces="true"></div>
</div>
<div style="clear:both;"></div>
回答by Tici
Make sure the FB.Event.subscribe('edge.create')call is right after the init (within the window.fbAsyncInitfunction and not outside of it)
确保FB.Event.subscribe('edge.create')调用是在 init 之后（在window.fbAsyncInit函数内而不是在函数外）
Example
例子
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
/* Additional initialization code here
******************************************************/
};
...then load the SDK Asynchronously!
...然后异步加载SDK！
