如何使用Javascript / FB.ui打开和关闭弹出窗口

时间:2011-06-27 15:05:42

标签: javascript facebook

我写了一个简单的函数来启动facebook共享对话框弹出窗口。问题是,当用户提交共享表单时,html链接中的重定向配置代码将用户发送回我的站点弹出窗口中,而不是关闭弹出窗口并显示响应fb发回。

function popwindow(url)
{
newwindow=window.open(url,'name','height=400,width=700');
if (window.focus) {newwindow.focus()}
}

使用html

<a href="#" onclick="popwindow('http://www.facebook.com/dialog/feed?app_id=XXX&link=somelink&display=dialog&redirect_uri=http://myurl.net/response/')">Share on Facebook</a>

现在我正在试图找出如何让FB的FB.ui js代码工作(我是初学者)。我已经查看了stackoverflow上的所有类似问题但无济于事。如何在我的页面的html中编写链接以调用弹出的FB共享对话框,在用户提交时提交,然后关闭弹出窗口并将用户发送到具有正确响应警报的正确确认URL?

我在facebook.js文件中有这个默认的fb代码

FB.ui(
{
 method: 'feed',
 display: 'dialog'
},
function popwindow(url)
{
newwindow=window.open(url,'name','height=400,width=700');
if (window.focus) {newwindow.focus()}
}
function(response) {
 if (response && response.post_id) {
   alert('Post was published.');
 } else {
   alert('Post was not published.');
 }
}
);

如何写出一个html链接来调用弹出窗口并让FB.ui来处理它?<​​/ strong>

1 个答案:

答案 0 :(得分:6)

您不必担心自己弹出对话 - FB.ui电话会为您解决此问题。 这是一个工作示例straight from documentation 以下是添加了一些HTML的示例:

<input type="button" onclick="share_prompt()" value="Share" />

<script src="http://connect.facebook.net/en_US/all.js" type="text/javascript" charset="utf-8"></script>
<div id="fb-root"></div>    
<script type="text/javascript" charset="utf-8">
FB.init({
    appId: 'YOUR_APP_ID', 
    status: true, 
    cookie: true,
    xfbml: true
});

function share_prompt()
{


    FB.ui(
       {
         method: 'feed',
         name: 'Facebook Dialogs',
         link: 'http://developers.facebook.com/docs/reference/dialogs/',
         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.');
         }
       }
     );
 }

</script>