Javascript 在Mootools中调用方法,正确的方法是什么?

Javascript 在Mootools中调用方法,正确的方法是什么?,javascript,jquery,dom-events,mootools,Javascript,Jquery,Dom Events,Mootools,我在mootools中创建了一个类,当第一次调用initialize()方法时,它会创建一个div元素,然后将其附加到文档.body中。然后,我附加一个上下文菜单处理程序,当在浏览器中选择上下文菜单中的选项时,该处理程序将调用函数 我遇到的问题是,上下文菜单处理程序实际上不会调用任何函数,我不太明白为什么,我想知道这里是否有人能够发现问题 以下是我创建的类和附带的上下文菜单处理程序,为了简洁起见,删除了一些其他代码: var uml_Canvas = new Class({ init

我在mootools中创建了一个类,当第一次调用
initialize()
方法时,它会创建一个div元素,然后将其附加到
文档.body
中。然后,我附加一个上下文菜单处理程序,当在浏览器中选择上下文菜单中的选项时,该处理程序将调用函数

我遇到的问题是,上下文菜单处理程序实际上不会调用任何函数,我不太明白为什么,我想知道这里是否有人能够发现问题

以下是我创建的类和附带的上下文菜单处理程序,为了简洁起见,删除了一些其他代码:

var uml_Canvas = new Class({  
    initialize: function()
    {
        this.mainCanvasDiv = document.createElement("div");
        this.mainCanvasDiv.id = "mainCanvas";
        this.mainAppDiv.appendChild(this.mainCanvasDiv);
        this.paper = Raphael(this.mainCanvasDiv.id, 500, 400);
        this.paper.draggable.enable();

        $("#"+this.mainCanvasDiv.id).contextMenu('canvasPanel_Menu', 
        {
            bindings: 
            {
                'clear': function(t) 
                {
                    this.clearPaper();
                }
            }
         });  
    },
    clearPaper : function()
    {
        this.paper.clear();
    }
});
因此,一个快速概述,创建一个对象,创建一个div,然后将其附加到主体。然后,div分配了一个上下文菜单。当调用“clear”选项时,由于某种原因,应该调用方法
clearPaper()
。但是,如果我替换
this.clearPaper()行通过一个简单的
alert()
调用,它确实会运行

有人知道为什么不能调用方法吗

顺便说一句,我得到的错误是this.clearPaper不是一个函数,如果这有帮助的话。

尝试将“this”绑定到clear函数:

'clear': function(t) 
{
    this.clearPaper();
}.bind(this)
这将接受“This”范围,并允许匿名函数使用它,就像它是该类的成员一样

请注意,每当您尝试在任何匿名函数中使用“this.”时,都必须这样做。例如,如果在类中有:

method: function() {
    button.addEvent('click', function(e) {
        new Request({
            onComplete: function(res) {
                this.process_result(res);
            }
        }).send();
    });
},
process_results: function(res) {...}
您必须一路捆绑:

method: function() {
    button.addEvent('click', function(e) {
        new Request({
            onComplete: function(res) {
                this.process_result(res);
            }.bind(this)
        }).send();
    }.bind(this));
},
process_results: function(res) {...}

注意event函数和onComplete函数上的新bind()s。这可能看起来是一个恼人的额外步骤,但如果不这样做,您将拥有对所有人都免费的范围。Mootools可以非常轻松地获取类范围并将其附加到匿名函数。

可能引用了错误的对象。尝试在方法内部跟踪
this
绑定:{clear:this.clearPaper.bind(this)}
也可以。jQuery使用#来表示id
$('id')
,在MooTools中
$()
函数需要一个id,所以使用
$('id')
同样,您甚至不需要将$()包装在
周围+此.mainCanvasDiv.id
,您已经将元素引用为
this.mainCanvasDiv
。如果您想确保它被扩展为mootools对象,那么可以使用
this.mainCanvasDiv=newelement(“div”)声明它
您就可以执行
这个.mainCanvasDiv.contextMenu('canvasPanel_Menu'),…