javascript - Facebook FBML 问题

Question

我有一个客户希望创建一个与 http://www.facebook.com/enchantment 非常相似的 Facebook 页面

在“附魔”页面中，您可以看到一个子选项卡列表，“附魔、简介、摘录、顺序”。我想创造相同的风格，但我似乎无法弄清楚如何。我查看了代码，发现他们在主选项卡上使用了“FBML Static”应用程序，并且有大量的 javascript 来显示和 Conceal 我非常怀疑都是手写的选项卡。

有人有这方面的经验吗？提前致谢。

Answer 1

您必须通过开发者页面中的“我的应用程序”链接创建一个 Facebook 应用程序。填写所有字段后，您的应用程序页面应该已启动并运行。

现在您需要开始在您的网站上开发实际的应用程序(您必须在您的应用程序设置中指定链接)。浏览开发人员文档，因为他们有很好的文档。

因此，为了实际创建这些选项卡，实际上非常简单，您所要做的就是利用 FBMls clicktoshow 和 clicktohide 属性。基本上您只需要以下代码:

<a href="#" clicktoshow="nav1" clicktohide="nav2,nav3">Link 1</a>

<a href="#" clicktoshow="nav2" clicktohide="nav1,nav3">Link 2</a>

<a href="#" clicktoshow="nav3" clicktohide="nav1,nav2">Link 3</a>

<div id="nav1">
//content for first tab
</div>

<div id="nav2">
//content for second tab
</div>

<div id="nav3">
//content for third tab
</div>

当 Facebook“导入”这个(仅通过 FMBL，我不确定这是否适用于 iframe)时，它会方便地完成所有工作并将上述链接转换为类似以下内容:

   <a href="#" clicktoshow="nav1" clicktohide="nav2, nav3" class="test" 
onclick="(new Image()).src = '/ajax/ct.php?app_id=7146470109&amp;action_type=3&amp;post_form_id=fd583a515fe76b1d3d300e974aba931d&amp;position=16&amp;' + Math.random();FBML.clickToHide(&quot;app7146470109_nav2&quot;);
FBML.clickToHide(&quot;app7146470109_nav3&quot;);
FBML.clickToHide(&quot;app7146470109_nav4&quot;);FBML.clickToHide(&quot;app7146470109_nav5&quot;);FBML.clickToHide(&quot;app7146470109_nav6&quot;);
FBML.clickToHide(&quot;app7146470109_nav7&quot;);FBML.clickToHide(&quot;app7146470109_nav8&quot;);FBML.clickToShow(&quot;app7146470109_nav1&quot;);return false;">Test</a>

但是，您只需担心第一部分，因为 Facebook 会处理第二部分。如您所见，这是一个相当简单的过程。