如何将其绑定到jQuery's事件

How to bind this to to a jQuery's event?

本文关键字:事件 jQuery 绑定      更新时间:2023-09-26

如何将其绑定到jQuery的事件?

例如,对于下面的推送菜单,我必须"记住"thisvar root:

class PushMenu {
    constructor() {
        this.slideShown = false;
        var root = this;
        $('.navmenu').on('shown.bs.offcanvas', function() {
            root.slideShown = true;
        });
    }
}

但我想知道我是否可以绑定this,这样我就可以节省var root:

class PushMenu {
    constructor() {
        this.slideShown = false;
        $('.navmenu').on('shown.bs.offcanvas', function() {
            this.slideShown = true;
        });
    }
}

这可能吗?

您正在使用es6类,所以我认为es6语法与箭头函数是正确的

$('.navmenu').on('shown.bs.offcanvas', () => {
    this.slideShown = true;
});

使用jQuery.proxy()

接受一个函数并返回一个新函数,该函数将始终具有特定的上下文。

class PushMenu {
    constructor() {
        this.slideShown = false;
        $('.navmenu').on('shown.bs.offcanvas', jQuery.proxy(function() {
            this.slideShown = true;
        }, this));
    }
}

我们可以在这里使用jQuery.proxy,这样对this的引用指的是PushMenu的对象,而不是触发事件的元素。

文档

    jQuery Proxy Usage
  • 的控制值