javascript 尝试通过传入函数来绑定回调会引发错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11023605/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Trying to bind a callback by passing in the function throws an error
提问by Brandon
I just want to fire an event when an input changes value using jQuery 1.7.2 and Backbone.js.
我只想在使用 jQuery 1.7.2 和 Backbone.js 的输入更改值时触发一个事件。
Currently I have the following (which works)
目前我有以下（有效）
MyView: Backbone.View.extend({
initialize: function() {
this.colorInput = $("<input />", {
"id": "color",
"name": "color",
"value": this.model.get("color")
});
var self = this;
this.colorInput.on("change", function() {
self.changeColor();
});
},
changeColor: function() {
var color = this.colorInput.val();
this.model.set("color", color);
}
});
I was trying to do it the other way where I just pass in my function.
我试图用另一种方式来做，我只是传入我的函数。
this.colorInput.on("change", this.changeColor, this);
But when trying to do it that way, it throws the error
但是当尝试这样做时，它会抛出错误
((jQuery.event.special[handleObj.origType] || {}).handle || handleObj.handler).apply is not a function
.apply( matched.elem, args );
((jQuery.event.special[handleObj.origType] || {}).handle || handleObj.handler).apply 不是一个函数
.apply(matched.elem, args);
（第 3332 行）
Which I'm not able to figure out. Any ideas why this way doesn't work?
我无法弄清楚。任何想法为什么这种方式不起作用？
回答by mu is too short
You're confusing jQuery's on:
你混淆了jQuery 的on：
.on( events [, selector] [, data], handler(eventObject) )
.on( events-map [, selector] [, data] )
.on( events [, selector] [, data], handler(eventObject) )
.on( events-map [, selector] [, data] )
with Backbone's on:
object.on(event, callback, [context])
object.on(事件，回调，[上下文])
Backbone's takes a context as the third argument, jQuery's doesn't. Looks like jQuery's onis interpreting your third argument as the handler(eventObject)and trying to call it like a function, that would explain the error message that you're seeing.
Backbone 将上下文作为第三个参数，而 jQuery 没有。看起来 jQueryon正在将您的第三个参数解释为 thehandler(eventObject)并尝试像函数一样调用它，这将解释您看到的错误消息。
Normally you'd do it more like this:
通常你会这样做：
MyView: Backbone.View.extend({
events: {
'change input': 'changeColor'
},
initialize: function() {
this.colorInput = $("<input />", {
"id": "color",
"name": "color",
"value": this.model.get("color")
});
},
render: function() {
this.$el.append(this.colorInput);
return this;
},
changeColor: function() {
var color = this.colorInput.val();
this.model.set("color", color);
}
});
and let Backbone's event delegation system take care of things.
并让 Backbone 的事件委托系统来处理事情。
回答by Michael Ryan Soileau
This is for the Googlers who come across this problem. I had this exact same issue and what occurred was that where the error was being reported and where the error actually occurred were in two different places.
这是为遇到此问题的 Google 员工准备的。我遇到了完全相同的问题，发生的情况是报告错误的位置和实际发生错误的位置在两个不同的地方。
One line of code was obsolete and looked something like
一行代码已经过时，看起来像
$('#modal').on('click', function(e) {
// Execute invalid code here.
});
The other line of code was similar:
另一行代码类似：
$('#modal').on('click', function(e) {
// Execute valid code here.
});
The error was that the first invocation was not a true function, so the error was accurate, the second handler being invoked was not a true function and jQuery couldn't complete it, but it always acted as if it occurred on the second function call.
错误是第一次调用不是真正的函数，所以错误是准确的，被调用的第二个处理程序不是真正的函数，jQuery 无法完成它，但它总是表现得好像它发生在第二次函数调用上.
I'd say if you run into this error, remove any extra event handlers that may be triggered and see if that stops the problem.
我想说的是，如果您遇到此错误，请删除可能被触发的任何额外事件处理程序，看看是否可以解决问题。
