2015-09-28 113 views
0

我在我的页面上有一个Facebook按钮。它调用一个共享弹出窗口。Facebook分享弹出式按钮停止工作后第一次点击

问题是该按钮只在第一次点击时工作。第二次,第三次点击不会做任何事情。我总是需要刷新页面。

我是新手。你能帮我解决这个问题吗?

谢谢。

<div id="fb-root"></div> 
    <script> 
     window.fbAsyncInit = function() { 
     FB.init({ 
      appId  : 'zzzzzzzzzz', 
      status  : true, 
      cookie  : true, 
      xfbml  : true 
     }); 

     FB.ui(
      { 
      method: 'feed', 
      name: 'Bitcoin Catcher Faucet & Rotator', 
      link: 'http://bitcoin-catcher.com', 
      picture: 'http://bitcoin-catcher.com/wp-content/uploads/2015/08/icon.png', 
      caption: 'Only 1000+ Rewards Faucet & Rotator', 
      description: 'Earn FREE Bitcoins Easier & Faster! Only 1000+ Rewards per Claim!' 
      }, 

      function(response) { 
      if (response && response.post_id) { 
    unhide('claim', ''); 
      } else { 
      } 
      } 
     ); 

     }; 

    function fb_callout() { 

     (function(d){ 
      var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0]; 
      if (d.getElementById(id)) {return;} 
      js = d.createElement('script'); js.id = id; js.async = true; 
      js.src = "//connect.facebook.net/en_US/all.js"; 
      ref.parentNode.insertBefore(js, ref); 
      }(document)); 
     } 
    </script> 

<img alt="Share on Facebook" src="http://bitcoin-catcher.com/wp-content/uploads/2015/09/facebook-share-button.png" width="180" onclick="fb_callout();" style="cursor: pointer;" /> 

回答

1

FB.ui的呼叫应该在fbAsyncInit之外。将其放置在“共享”按钮的单击事件处理程序中。

在您的代码示例中,FB JS SDK是,每次点击都会加载这不是你想要的。

即使它第一次工作,因为一旦它被加载,SDK会调用fbAsyncInit,在您的示例中又错误地再次显示通过FB.ui调用的进纸对话框,重新加载SDK会断开API以供后续调用。 SDK不应该每次都加载。

您想要的只是在页面加载时加载SDK一次(它是异步的,所以它不会阻止浏览器),然后为调用FB.ui的按钮分配一个点击处理程序。

它会看起来类似于下面的东西

<body> 
<img alt="Share on Facebook" onclick="fb_callout();" /> 

<script> 
    // Handler for click event 
    function fb_callout() { 
    FB.ui({...}, function(response) {}); 
    } 

    // This is called when the SDK js file is loaded by the browser 
    window.fbAsyncInit = function() { 
    FB.init({ 
     appId  : 'zzzzzzzzzz', 
     status  : true, 
     cookie  : true, 
     xfbml  : true 
    }); 
    } 

    // This loads the FB SDK js 
    (function(d){ 
    var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0]; 
    if (d.getElementById(id)) {return;} 
    js = d.createElement('script'); js.id = id; js.async = true; 
    js.src = "//connect.facebook.net/en_US/all.js"; 
    ref.parentNode.insertBefore(js, ref); 
    }(document)); 
</script> 
</body> 
+0

Marekful。我确实通过这种方式更改了代码,但没有成功。这次第一次点击也停止了。你能举一个代码的例子吗? – Rafael

+0

请看看我现在发布的新代码... – Rafael

+0

只要在我的答案中这样做。仔细看一下。你仍然把所有的东西放在fb_callout函数中;) – marekful

0

我没有这样的,什么也没有发生......

<img alt="Share on Facebook" src="http://bitcoin-catcher.com/wp-content/uploads/2015/09/facebook-share-button.png" width="180" onclick="fb_callout();" style="cursor: pointer;" /> 

<div id="fb-root"></div> 
<script> 

function fb_callout() { 

    FB.ui(
     { 
     method: 'feed', 
     name: 'Bitcoin Catcher Faucet & Rotator', 
     link: 'http://bitcoin-catcher.com', 
     picture: 'http://bitcoin-catcher.com/wp-content/uploads/2015/08/icon.png', 
     caption: 'Only 1000+ Rewards Faucet & Rotator', 
     description: 'Earn FREE Bitcoins Easier & Faster! Only 1000+ Rewards per Claim!' 
     }, 

     function(response) { 
     if (response && response.post_id) { 
unhide('claim', ''); 
     } else { 
     } 
     } 
    ); 

    window.fbAsyncInit = function() { 
    FB.init({ 
     appId  : 'xxxxxxxxxxx', 
     status  : true, 
     cookie  : true, 
     xfbml  : true 
    }); 

    (function(d){ 
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0]; 
     if (d.getElementById(id)) {return;} 
     js = d.createElement('script'); js.id = id; js.async = true; 
     js.src = "//connect.facebook.net/en_US/all.js"; 
     ref.parentNode.insertBefore(js, ref); 
     }(document)); 
    } 

    }; 


</script> 
相关问题