Intentar vincular una devolución de llamada al pasar la función arroja un error

Question

Solo quiero activar un evento cuando una entrada cambia de valor usando jQuery 1.7.2 y Backbone.js.

Actualmente tengo el siguiente (que funciona)

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); 
    } 
}); 

yo estaba tratando de hacerlo a la inversa en el que sólo tiene que pasar en mi función.

this.colorInput.on("change", this.changeColor, this); 

Pero cuando se trata de hacerlo de esa manera, se lanza el error

((jQuery.event.special [handleObj.origType] || {}). || manejar handleObj. manejador) .aplicar no es una función
.apply (compatible.elem, args);

(line 3332)

¿Qué no soy capaz de averiguar. ¿Alguna idea de por qué esta manera no funciona?

Answer 1

Estás confundiendo jQuery's on:

.ON (eventos, selector [] [], datos, manipulador (eventObject))
.on (eventos de ruta [selector] [ , datos])

con Backbone's on:

object.on (evento, devolución de llamada, [contexto])

espinazo toma un contexto como el tercer argumento, jQuery no. Parece que el on de jQuery está interpretando su tercer argumento como handler(eventObject) y tratando de llamarlo como una función, que explicaría el mensaje de error que está viendo.

Lo normal sería lo hace de la misma familia:

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); 
    } 
}); 

y dejar que el sistema de delegación de eventos Backbone cuidar de las cosas.

Answer 2

Esto es para los Googlers que se encuentran con este problema. Tuve exactamente este mismo problema y lo que ocurrió fue que el lugar donde se informó el error y dónde ocurrió realmente el error se encontraba en dos lugares diferentes.

una línea de código era obsoleta y se veía algo así como

$('#modal').on('click', function(e) { 
    // Execute invalid code here. 
}); 

La otra línea de código fue similar:

$('#modal').on('click', function(e) { 
    // Execute valid code here. 
}); 

El error fue que la primera invocación no era una verdadera función, por lo el error era exacto, el segundo controlador invocado no era una verdadera función y jQuery no podía completarlo, pero siempre actuaba como si hubiera ocurrido en la segunda llamada a la función.

Yo diría que si se encuentra con este error, elimine cualquier controlador de eventos extra que pueda activarse y vea si eso detiene el problema.