Facebook登錄按鈕javascript onclick事件

Question

我正在嘗試創建一個簡單的FB登錄名，該登錄名將請求電子郵件權限... 第二個塊使用按鈕選項＃2正常運行 ，
但是使用按鈕選項＃1的 第二個塊不會調用authUser（）函數，
＆當我嘗試將第一個塊用於相同的結果時，它也不起作用。

1. 為什么第一個塊不調用authUser（）函數？
   
2. 是因為登錄按鈕類型？
   
3. 如果是這樣，如何使用按鈕選項＃1啟用data-auto-logout-link="true" ？
4. 在第二個塊中使用按鈕選項＃2時 ， onClick（）函數也不被調用...為什么？

我已經可以假設是facebook按鈕類型導致了這種情況，並在代碼中查看了權限要求...

• 兩個塊都在同一個<script type="text/javascript">標記中

第一選擇

FB.init({
  appId      : 'YOUR_APP_ID',
  status     : true, // check login status
  cookie     : true, // enable cookies to allow the server to access the session
  xfbml      : true  // parse XFBML
});


// Check if the current user is logged in and has authorized the app
FB.getLoginStatus(checkLoginStatus);

// Login in the current user via Facebook and ask for email permission
function authUser() {
  console.log("--- authUser ---");
  FB.login(checkLoginStatus, {scope : 'email'});
}

// Check the result of the user status and display login button if necessary
function checkLoginStatus(response) {
  if(response && response.status == 'connected') {
    console.log('User is authorized');

  } else if (response.status === 'not_authorized') {
    console.log('User is not_authorized ... ');

  } else {
    console.log('User is not authorized');
    document.getElementById('loginButton').style.display = 'inline-block';
  }
}

• 按鈕：

  <div class="fb-login-button" id="loginButton" data-max-rows="1" data-size="medium" data-show-faces="false" data-auto-logout-link="true" onclick="authUser();"></div>

第二選擇

window.onload = function() {
  document.getElementById('fb-login').onclick = function() {
  var cb = function(response) {
    console.log('FB.login callback', response);
    if (response.status === 'connected') {
      console.log('User logged in');
    } else {
      console.log('User is logged out');
    }
  };
  FB.login(cb, { scope: 'email' });
};
}

• 有2個按鈕選項：

  1. <fb:login-button id="fb-login" data-max-rows="1" data-size="medium" data-show-faces="false" data-auto-logout-link="true"></fb:login-button>

  2. <button id="fb-login">FaceBook Login</button>

     • 不在真實代碼中使用相同的按鈕ID，這僅是示例

感謝名單。

Answer 1

我從未嘗試過，但這可能會有所幫助。

開發人員Facebook

JavaScript的特殊部分：

開發人員Facebook-JavaScript

Answer 2

你可以在這里找到一些解決方案

<div id="fb-root"></div>
 <script>
    (function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s);
        js.id = id;
        js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=xxxxxxxxxxx";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));


   function loginfb() {
    FB.init({
    appId:'xxxxxxxxxxxxxxxx',
    cookie:true,
    status:true,
    xfbml:false
    });
        FB.login(function(responses) {
            if(responses.authResponse)
            {
                FB.api('/me?fields=email,name', function(response) {
alert(response.email);
                });
            }
        });

    }
</script>