javascript - jQuery - 触发器未产生预期结果

Question

在我的应用程序中，当页面加载时，我会启动 init 函数来执行 3 件事，

1. 触发并发送页码。 (我想将页面默认设置为 1)

2. 触发完成后，我想听到，所以我正在听

3. 同样，用户可以插入/编辑页码(文本框)，因此我要添加一个监听器来运行。

但是当函数启动时，我正在安慰一个对象，但我得到的结果是未定义。

这里出了什么问题:

var docLoader = function (params) {

    window.container = window.container || $("#tenderContent");

    return {
        init : function () {
            this.cachePages = {};
            $(document).on("newMessage", this.onPageChange);
            $.event.trigger({
                type: "newMessage"
            });
        },

        onPageChange : function (e) {
            console.log(this.cachePages) //undefined why?
        }
    }
}

html 页面:

<script>
    docLoader().init();
</script>

我是解耦方法的新手，有人可以帮我提供详细信息吗？

Answer 1

这是因为你丢失了 this 上下文。 jQuery 将 DOM 元素作为上下文传递，而不是原始上下文。

您需要将函数的上下文绑定(bind)到现有的 this:

$(document).on("newMessage", this.onPageChange.bind(this));