jquery - 无法读取未定义的属性“url”。jQuery 加载小部件失败

Question

我正在尝试在 jQuery 中构建一个小部件来处理将内容加载到页面上的某些 div。我这样做的原因是为了让我的代码保持干燥。我也许应该提到我使用 HeadJS 来加载 javascript。

这是我的小部件代码：

(function ($, window, document, undefined) {

    $.widget ("my.contentloader", {

        options: {

            loadingMessage: true,

            errorDiv: '#error',

            contentDiv: '#content'

        },

        _create: function () {

            $.ajax ({

                type: "POST", 

                url: self.options.url, 

                data: {limit: self.options.params.limit, offset: self.options.params.offset},

                beforeSend: function (html) {

                    // Check if loading message should be displayed

                    if (self.options.loadingMessage) {

                        $(self.options.contentDiv).html ("<div id='loading'>Loading</div>");

                    }

                },

                success: function (html) {

                    if (self.options.loadingMessage) {

                        $('#loading').remove ();

                    }

                    $(self.options.contentDiv).html (html);

                },

                error: function (html) {

                    $(self.options.errorDiv).html (html);

                }

            });

        },

        _setOption: function (key, value) {

            this.options[key] = value;

            $.Widget.prototype._setOption.apply (this, arguments);

    }

    });

})(jQuery, window, document);

我在调用页面上包含了这个小部件文件和 jquery。然后我像这样使用插件：

 $(window).contentloader ({

  url: 'loading/content/url'

 });

问题是我收到此错误：

Uncaught TypeError: Cannot read property 'url' of undefined

Answer 1

你没有self在任何地方定义，所以你得到了window.self，那就是

对窗口对象的对象引用。

并且没有options属性。您应该使用this而不是self; this如果您需要在回调中强制执行特定操作，请执行以下操作：

var _this = this; // or 'var that'

在定义回调和使用_this（或that）之前：

_create: function () {
    var _this = this;
    $.ajax ({
        // ...
        beforeSend: function (html) {
            if (_this.options.loadingMessage) {
                //...

的存在是window.self一个var self糟糕的名字选择。