javascript - How to load facebook JS SDk in the jQuery block?

According to Facebook: "The best place to put this code is right after the opening tag"

Example:

<body>
<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'YOUR_APP_ID', // App ID
      channelURL : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      oauth      : true, // enable OAuth 2.0
      xfbml      : true  // parse XFBML
    });

    // Additional initialization code here
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>

But I would like like to add this in the jquery block $(document).ready(function() { }

How can that be done?

According to Facebook: "The best place to put this code is right after the opening tag"

Example:

<body>
<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'YOUR_APP_ID', // App ID
      channelURL : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      oauth      : true, // enable OAuth 2.0
      xfbml      : true  // parse XFBML
    });

    // Additional initialization code here
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>

But I would like like to add this in the jquery block $(document).ready(function() { }

How can that be done?

Share Improve this question asked Nov 10, 2011 at 12:49 I'll-Be-Back 10.8k42 gold badges118 silver badges226 bronze badges

Add a ment |

3 Answers 3

Sorted by: Reset to default 3

Include jQuery, and then...

$(document).ready(function(){
    callFB();
    loginClick(); // Call function
});

function callFB(){
    window.fbAsyncInit = function() {
      FB.init({
        appId      : 'YOUR_APP_ID', // App ID
        channelURL : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
        status     : true, // check login status
        cookie     : true, // enable cookies to allow the server to access the session
        oauth      : true, // enable OAuth 2.0
        xfbml      : true  // parse XFBML
      });

    // Additional initialization code here
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));     


}

function loginClick(){
   // your click handling code in here
}

This is more what you're looking for I think... https://developers.facebook./docs/javascript/howto/jquery/

You can try this jQuery plugin i made too.. :]

jQuery.fbInit = function(app_id) {
    window.fbAsyncInit = function() {
        FB.init({
            appId      : app_id, // App ID
            status     : true, // check login status
            cookie     : true, // enable cookies to allow the server to access the session
            xfbml      : true  // parse XFBML
        });
    };

    // Load the SDK Asynchronously
    (function(d){
        var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
        js = d.createElement('script'); js.id = id; js.async = true;
        js.src = "//connect.facebook/en_US/all.js";
        d.getElementsByTagName('head')[0].appendChild(js);
    }(document));

    $('<div />').attr('id','fb-root').appendTo('body');
};

$(document).ready(function(){
    $.fbInit('12345678901234');
});

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - How to load facebook JS SDk in the jQuery block? - Stack Overflow

3 Answers 3

与本文相关的文章

评论列表(0)