Когда я добавляю событие onclick, которое ссылается на метод, прикрепленный к объекту, метод, кажется, теряет все свойства, связанные с этим объектом

Question

Я хочу иметь возможность передавать один объект другому, а затем настраивать события, которые выполняют разные методы из исходного объекта.

var TEST = {}; 
//User-created object
TEST.testObj = function () { this.initialize.apply(this, arguments); };
TEST.testObj.prototype = {
    initialize: function(a) {   
        this.a = a;
    },
    sayHi: function() {
    alert(a);
}
} 
//Menu accosiated with that class of objects 
TEST.testMenu = function () { this.initialize.apply(this, arguments); };
TEST.testMenu.prototype = {
    initialize: function(obj) {
        this.obj = obj;
        var menuItem = document.createElement('div');
        menuItem.innerHTML = 'Say Hi!';
        menuItem.onclick = this.obj.sayHi;
        document.body.appendChild(menuItem);
    }
}

t1 = new TEST.testObj('Test Object');
menu = new TEST.testMenu(t1);

Активация события путем нажатия на оповещения div неопределенные.Похоже, что она вызывает функцию sayHi, но она не связана с экземпляром объекта.

Спасибо!

Answer 1

У вас нет функции sayHi (), объявленной в этом коде.Просто добавьте эту строку

TEST.testObj.prototype.sayHi = function() {alert('hi')}

после части TEST.testObj.prototype....Это создаст новую функцию в цепочке прототипов TEST, которую вы можете вызывать внутри объекта testMenu

EDIT Способ привязки события onclick, которого имел в видуHTML-элемент div, а не объект.Это измененный код, который должен работать:

var TEST = {}; 
        //User-created object
        TEST.testObj = function () { this.initialize.apply(this, arguments); };
        TEST.testObj.prototype = {
            a: null, 
            initialize: function(a) {
                this.a = a;
            },
            sayHi: function() {
            alert(this.a);
        }
        } 
        //Menu accosiated with that class of objects 
        TEST.testMenu = function () { this.initialize.apply(this, arguments); };
        TEST.testMenu.prototype = {
            initialize: function(obj) {
                this.obj = obj;
                var menuItem = document.createElement('div');
                menuItem.innerHTML = 'Say Hi!';
                menuItem.onclick = function() { obj.sayHi(); }
                document.body.appendChild(menuItem);
            }
        }

        t1 = new TEST.testObj('Test Object');
        menu = new TEST.testMenu(t1);