Question

我在Facebook Javascript上有错误“Uncaught TypeError：无法设置属性'onclick'of null”第187行和第187行是：

" button.onclick = function() {"

所有代码均为：

<script type="text/javascript">
window.fbAsyncInit = function() {
  FB.init({ appId: <?php echo json_encode($this->getApiKey()) ?>, 
        status: true, 
        cookie: true,
        xfbml: true,
        oauth: true});
 FB.Canvas.setSize({ width: 640, height:1500 });
 //FB.Canvas.setAutoResize();
 function updateButton(response) {
    var button = document.getElementById('fb-auth');

    if (response.authResponse == 'null') {
      //user is already logged in and connected
      var userInfo = document.getElementById('user-info');
     FB.api('/me', function(response) {


      });

      button.onclick = function() {
        FB.logout(function(response) {
          var userInfo = document.getElementById('user-info');
          userInfo.innerHTML="";
    });
      };
    } else {
      //user is not connected to your app or logged out
      //button.innerHTML = 'Login';
      button.onclick = function() {
        FB.login(function(response) {
if(response.status=='connected') setLocation('<?php echo $this->getConnectUrl() ?>');
      if (response.authResponse) {
            FB.api('/me', function(response) {
          var userInfo = document.getElementById('user-info');


        });  

          } else {
            //user cancelled login or did not grant authorization
          }
         }, {scope:'email, user_birthday'});    
      }
    }
  }

  // run once with current status and whenever the status changes
  FB.getLoginStatus(updateButton);
  //FB.Event.subscribe('auth.statusChange', updateButton);  
};

(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>

如果需要更多信息，请告诉我我很感激帮助。谢谢！

Answer 1

快速查看代码表明当您尝试访问该按钮时该按钮不存在：

function updateButton(response) {
    var button = document.getElementById('fb-auth');
    //there is no element with id fb-auth
    console.log("button is now:",button);

在设置按钮变量之后，在尝试使用它之前，请将上面的示例中的一些console.log放在那里，然后更新问题，确切地说它出错了。

使用带有firebug插件的Chrome或Firefox来查看正确的console.logs，然后按F12打开开发工具（默认情况下打开控制台选项卡）。

[UPDATE]

我已经删除了引用fb-auth按钮的代码，所以如果该代码旧且未使用，则以下内容应该有效：

<script type="text/javascript">
window.fbAsyncInit = function() {
  FB.init({ appId: <?php echo json_encode($this->getApiKey()) ?>, 
        status: true, 
        cookie: true,
        xfbml: true,
        oauth: true});
 FB.Canvas.setSize({ width: 640, height:1500 });
 function updateButton(response) {
    if (response.authResponse == 'null') {
     //user is already logged in and connected
     var userInfo = document.getElementById('user-info');
     FB.api('/me', function(response) {
     });
    } else {
  // run once with current status and whenever the status changes
  FB.getLoginStatus(updateButton);
  //FB.Event.subscribe('auth.statusChange', updateButton);  
};

(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>

Answer 2

可能是因为您的JavaScript不在页面的底部，并且在运行时，DOM树尚未构建。在构建元素之后，尝试将代码放在html页面的不同部分。

错误未捕获TypeError：无法设置null的属性'onclick'

2 个答案: