javascript - 单击时出现未定义的 Javascript 错误

Question

不知道为什么当我尝试单击该按钮时会收到此错误。

Uncaught TypeError: Cannot read property 'on' of undefined

JSFiddle:https://jsfiddle.net/mm5crd3b/

谢谢

$(document).ready(function(){

(function() {
    var itemTracker = {
        // init
        init: function() {
            this.bindEvents();
        },

        // cacheDom
        cacheDom: {
            inputAdd: $('#inputAdd'),
            submitAdd: $('#submitItem')
        },

        // item
        item: {
            text: this.inputAdd.value,
        },

        // Bind Events
        bindEvents: function() {
            this.submitAdd.on("click", addItem);
        },

        // Add item
        addItem: function() {
            console.log("test");
        }

        // Remove item

        // Edit Item

        // Complete Item

        // Uncomplete Item
    };

    itemTracker.init();

})();

});

Answer 1

您访问该属性的方式错误，

bindEvents: function() {
  this.cacheDom.submitAdd.on("click", addItem);
},

当看到您的代码时，我可以看出 cacheDom 是一个对象，其中包含 submitAdd 作为属性。

此外，

item: {
 text: this.inputAdd.value,
},

这部分代码不会按预期工作。您可以将其编写为 getter 来解决您的问题。

get itemText() {
 return this.cacheDom.inputAdd.value,
},