Question

当用户点击我的Facebook应用程序上的某个链接时，如何显示典型的脸书模式帮助对话框？

感谢。

Answer 1

如果您使用的是IFrame应用程序，则可以使用JS API中的FB.UI.PopupDialog。坏消息是此功能没有文档，并且使用起来不是很容易。好消息是我已经弄明白了！：）

// First, define the HTML content you want in the dialog as a javascript string:
var content = '<div><h2>Help is here!</h2><div>Hint: you can eat the cookies!</div></div>';

// Then add the content to this resource dictionary thing, wrapped in a div with the id "RES_ID[your identifier here]"
FB.UI.DomResources.addResourceDict(new FB.UI.DomResDict('<div id="RES_IDhelp01">' + content + '</div>'));

// Instantiate the popup dialog and show it:
var popup = new FB.UI.PopupDialog('Help?!', FB.UI.DomResources.getResourceById('help01'), false, false);
popup.show();

当然，这些位可以根据需要通过您的页面展开，您可以使用php为您生成html内容。

简单，对吗？：D欣赏！

Answer 2

Codebliss'链接让我进入了一个文档页面，向我展示了如何使用JS SDK在您的网页中调用iframe弹出对话框。您首先必须加载Facebook脚本：

<div id="fb-root"></div>
  <script>
    window.fbAsyncInit = function() {
      FB.init({appId: '[YOUR_APP_ID]', status: true, cookie: true, xfbml: true});
  };
  (function() {
    var e = document.createElement('script'); e.async = true;
    e.src = document.location.protocol +
    '//connect.facebook.net/en_US/all.js';
    document.getElementById('fb-root').appendChild(e);
  }());
 </script>

然后在页面中添加类似内容：

<a href="#" id="test">click me</a>
// some code
$(document).ready(function() {
  $('#test').click(function() {
    FB.ui({
      method: 'feed',
      name: 'Facebook Dialogs',
      link: '[YOUR_WEBSITES_REGISTERED_URL_ON_FB]',
      picture: 'http://fbrell.com/f8.jpg',
      caption: 'Reference Documentation',
      description: 'Dialogs provide a simple, consistent interface for applications to interface with users.',
      message: 'Facebook Dialogs are easy!'
    },
    function(response) {
      if (response && response.post_id) {
        alert('Post was published.');
      } else {
        alert('Post was not published.');
      }
    });
  });
});

Facebook - 显示帮助对话框

2 个答案: