Facebook开放图表 - '喜欢按钮' - 隐藏的内容透露在'喜欢'上

Question

我想知道，我希望在Facebook的Open Graph（特别是类似的按钮）上有一个登陆页面，我希望基本上可以显示内容：none（在用户喜欢页面之前不记得具体内容。例如电子商务商店中的div，当用户喜欢该页面时，div被设置为显示：块，用户可以兑换优惠券代码以进行折扣。

我希望能够用div显示器做到这一点。

我在Facebook开发者论坛上看到了这一小段代码：

| （取自http://fbrell.com/xfbml/fb:like ） （注意：单击“喜欢”时触发的事件）

<script>
  // this will fire when any of the like widgets are "liked" by the user
  FB.Event.subscribe('edge.create', function(href, widget) {
    Log.info('You liked ' + href, widget);
  });
</script>

可以修改为有效设置显示div：无显示：块？

谢谢你这么。

Answer 1

如果您特别想要更新您的div以display:block ，请使用...

<script>
  // this will fire when any of the like widgets are "liked" by the user
  FB.Event.subscribe('edge.create', function(href, widget) {
    $('#divid').css('display','block');
  });
</script>

一个警告......

除非您作为通话一部分使用的网址与您尝试触发此网址的网址完全相同，否则您的edge.create事件不会触发。

我有一个我运行的网站example.DEV （我的本地笔记本电脑开发环境）引用了example.com （实时服务器）上的链接， FB.Event.subscribe()块中的任何内容都不会运行，直到我上传该文件，并从LIVE服务器解雇。

这可能就是为什么你遇到麻烦，如果它到目前为止没有工作！

Answer 2

我找到了以下解决方案，但你需要jQuery才能做到这一点。 （可能不是，但这就是我以前做过的事情）。

这是代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="facebook.js"></script>
<script src="jquery.min.js" type="text/javascript"></script>

</head>

<body>
<div id="fb-root"></div>
<script type="text/javascript">
<!--
window.fbAsyncInit = function() {
 FB.init({appId: '133387220039676', status: true, cookie: true, xfbml: true});
 FB.Event.subscribe('edge.create', function(href, widget) {
 // Do something, e.g. track the click on the "Like" button here
    $('#slidingDiv').show();
 });
};
(function() {
 var e = document.createElement('script');
 e.type = 'text/javascript';
 e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
 e.async = true;
 document.getElementById('fb-root').appendChild(e);
 }());
//-->
</script>
<fb:like href="http://www.facebook.com/TheRightMind" layout="standard" show-faces="false" width="450" action="like" colorscheme="light"></fb:like>

<div id="slidingDiv" style="display:none;">
Fill this space with really interesting content that you can
</div>

</body>
</html>

Answer 3

验证喜欢页面后会触发该代码（尝试console.log("AOK!") ），您可以使用以下代码显示<div> ：

普通的旧JavaScript：

FB.Event.subscribe('edge.create', function(href, widget) {
  document.getElementById("topsecret").style.display = "block";
});

HTML：

<div id="topsecret" style="display:none;">
  Content Goes Here
</div>

如果你正在使用jQuery库或类似的东西，你可以使用show()函数来显示框：

FB.Event.subscribe('edge.create', function(href, widget) {
  $("#topsecret").show();
  //$("#topsecret").slideDown("fast");
  //$("#topsecret").fadeIn("fast");
});

您也可以考虑使用AJAX加载命令，否则只有在隐藏内容时才能显示框。

FB.Event.subscribe('edge.create', function(href, widget) {
  $("#topsecret").load("mycontent.html");
});

Answer 4

只需用显示div JavaScript替换Log.info()调用即可。 在jQuery中：

<script>
  // this will fire when any of the like widgets are "liked" by the user
  FB.Event.subscribe('edge.create', function(href, widget) {
    $('#yourdiv').show();
  });
</script>

Facebook开放图表 - '喜欢按钮' - 隐藏的内容透露在'喜欢'上

问题描述

4 个解决方案

解决方案1
2 2010-07-03 04:51:36

解决方案2
2 2010-10-21 09:20:13

解决方案3
0 2013-04-11 16:22:54

解决方案4
0 2010-05-24 22:10:03

Facebook开放图表 - &#39;喜欢按钮&#39; - 隐藏的内容透露在&#39;喜欢&#39;上

问题描述

4 个解决方案

解决方案1 2 2010-07-03 04:51:36

解决方案2 2 2010-10-21 09:20:13

解决方案3 0 2013-04-11 16:22:54

解决方案4 0 2010-05-24 22:10:03

Facebook开放图表 - '喜欢按钮' - 隐藏的内容透露在'喜欢'上

解决方案1
2 2010-07-03 04:51:36

解决方案2
2 2010-10-21 09:20:13

解决方案3
0 2013-04-11 16:22:54

解决方案4
0 2010-05-24 22:10:03