将我的jQuery函数更改为构造函数

Question

我一直在我的Wordpress网站上使用jQuery函数来打开和关闭手风琴。该函数本身运行良好，但是我想向文件中添加更多jQuery。这看起来很混乱，所以我决定制作不同的模块。正如我之前所做的那样，我想使用构造函数来执行此操作。这是我第一次自己做，但是在使它正常工作时遇到了问题。

没有显示任何错误，单击时没有任何反应。

 $(document).ready(function () {


  $('.accordion-toggle').on('click', function (event) {

        event.preventDefault();

        var accordion = $(this);

        var accordionContent = accordion.next('#accordion-content');

        accordion.toggleClass("open");

        accordionContent.slideToggle("slow");

    });

});

构造函数

import $ from 'jquery';


class Accordion {

    constructor() {

        this.toggleButton = $('.accordion-toggle');

        this.accordionContent = this.toggleButton.next('#accordion-content');

        this.events();
    }

    events() {
        this.toggleButton.on('click', this.openToggle.bind(this));
    }

    openToggle() {

        this.toggleButton.toggleClass('open');
        this.accordionContent.slideToggle('slow');
    }

}



export default Accordion;