jQuery插件-调用函数返回Uncaught TypeError

Question

I am not sure how to call the function in jQuery Plugin. I am trying to make something small like social sharer, it would be my first plugin but I am confused.

Uncaught TypeError: Object [object Object] has no method '_echoCookie' 

Here's what it does...

function EchoSoc(element, options) {
    this.element = element;

    this.options = $.extend({}, defaults, options);
    this._defaults = defaults;
    this._name = pluginName;
    this.init();
}

After that we have some stuff into init: function () { } such as:

$('body').append( //-->
                '<div id="fb-root" />'
            +   '<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";fjs.parentNode.insertBefore(js, fjs);}(document, "script", "facebook-jssdk"));</script>'
            +   '<script src="//platform.twitter.com/widgets.js"></script>'
            +   '<script src="//apis.google.com/js/plusone.js"></script>'
            // <--
            );

and as this is a test for google as sample here's one last piece:

$('.echoGoogle').append('<g:plusone size="medium" href="' + this.options.google_url + '" callback="googleCB"></g:plusone>');

Then we have these functions:

_echoEvents: function () {
        googleCB = function() {
            this._echoCookie();
        };
    },
    _echoCookie: function () {
        $.cookie('echoSoc', 'done', { expires: 30, path: '/' });
        console.log('cookie added');
    }

But this simply won't work...

_echoEvents: function () {
        googleCB = function() {
            this._echoCookie();
        };
    }

Well my question is how to call the function within other functions below init... this._functionName(); only works into init not in the functions below it. Thanks in advance.

Answer 1

It should be as given below since, when you call _echoCookie with in _echoEvents the this variable might be pointing to a different context. So use a closure variable to hold the reference to the main object and use it inside googleCB

_echoEvents: function () {
    var that = this;
    googleCB = function() {
        that._echoCookie();
    };
},
_echoCookie: function () {
    $.cookie('echoSoc', 'done', { expires: 30, path: '/' });
    console.log('cookie added');
}