javascript - 点击事件导致错误`TypeError: this.$varName.on is not a function` which is not a function

Question

我有这个确切的代码：

<span class="btn" id="setScheduleBtn">Set Schedule</span>
    <div id="reportSchedule" name="reportSchedule" style="display: none;">text</div>


<script type="text/javascript">
/******************/
/** Set Schedule **/ 
/******************/
(function() {

    var schedule = {

        report: [], 
        template: $('#report_schedule').html(),

        // Init functions
        init: function() {
            this.cacheDom();
            this.bindEvents();
        }, 
        // Cache elements from DOM
        cacheDom: function() {
            this.$setScheduleBtn = $('#setScheduleBtn'); 
            this.$reportSchedule = $('#reportSchedule');
        }, 
        // Set events
        bindEvents: function() {
            this.$setScheduleBtn.on('click', this.showReportScheduler.bind(this));
        }, 
        // Display on click
        showReportScheduler: function() {
            this.$reportSchedule.toggle();
        }

    };
    schedule.init();

})();
</script>

在我的本地机器项目上运行此代码 - 我在控制台中收到此错误结果： TypeError: this.$setScheduleBtn.on is not a function 无需切换。jQuery 被加载到标签中。html 代码位于脚本之前。jQuery JavaScript 库 v1.3.2

这是一个具有正确运行的确切代码的 JSfiddle： https ://jsfiddle.net/t6hprf4x/

可能是什么问题？

Answer 1

根据文档on版本中添加了该功能1.7，这意味着您正在使用的版本没有此功能。

您将不得不使用更新版本的库或使用该click函数添加点击侦听器。

this.$setScheduleBtn.click(this.showReportScheduler.bind(this));