javascript - jQuery 每个函数抛出错误 : Uncaught TypeError: Cannot read property

Question

我正在为我的项目创建一个自定义的step.js 应用程序。我在对象范围上遇到错误。下面是我的代码

var STEPPED = {
    el: {
        stepContentDiv: $('#stepContent'),
        stepNavDiv:     $('#stepNav'),
        stepNavLi:      $('#stepNav li'),
        stepNavAnchor:  $('#stepNav li a'),
        stepNavDone:  $('#stepNav li a'),
        stepNavActive:  $('#stepNav li a')
    },
    doActive: function(){
        this.el.stepNavDone.on('click', function(){
            this.el.stepNavLi.each(function(){
                alert();
            });
        });
    },
    init: function(){
        this.doActive();
    }
}
STEPPED.init();

运行时出现错误

this.el.stepNavLi.each(function(){
    alert();
});

Uncaught TypeError: Cannot read property 'stepNavLi' of undefined

任何人都可以帮我解决这里的问题吗？提前致谢

Answer 1

在 click 事件处理函数中，this 指的是被单击的元素，而不是 STEPPED 对象。如果您想在单击处理程序中保留对该对象的引用，则需要将对该对象的引用缓存在变量中。试试这个:

doActive: function() {
    var _stepped = this;
    _stepped.el.stepNavDone.on('click', function(){
        _stepped.el.stepNavLi.each(function(){
            alert();
        });
    });
},