Cercando di associare un callback passando la funzione si genera un errore

Question

Voglio solo generare un evento quando un input cambia valore usando jQuery 1.7.2 e Backbone.js.

Attualmente ho il seguente (che funziona)

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

stavo cercando di fare il contrario dove ho appena passo nella mia funzione.

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

Ma quando si cerca di fare in questo modo, si genera l'errore

((jQuery.event.special [handleObj.origType] || {}). Gestire || handleObj. gestore) .apply non è una funzione
.apply (matched.elem, args);

(line 3332)

che io non sono in grado di capire. Qualche idea per cui questo modo non funziona?

Answer 1

Stai confondendo jQuery's on:

.On (eventi [,] [selettore, dati], handler (eventObject))
.on (eventi-map [, selettore] [ , dati])

con Backbone's on:

object.on (evento, richiamata, [contesto])

Backbone prende un contesto come terzo argomento, jQuery di no. Sembra che il on di jQuery stia interpretando il tuo terzo argomento come handler(eventObject) e provando a chiamarlo come una funzione, che spiegherebbe il messaggio di errore che stai vedendo.

Normalmente lo faresti più simile a questo:

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

e lasciare che il sistema della delegazione evento di Backbone prendersi cura delle cose.

Answer 2

Questo è per i googler che si imbattono in questo problema. Ho avuto questo stesso identico problema e ciò che è accaduto è stato quello in cui l'errore veniva segnalato e dove si verificava effettivamente l'errore si trovavano in due luoghi diversi.

una riga di codice era obsoleto e sembrava qualcosa di simile

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

L'altra riga di codice è stata simile:

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

L'errore era che la prima chiamata non è stata una vera funzione, in modo da l'errore era accurato, il secondo gestore invocato non era una funzione vera e jQuery non poteva completarlo, ma si comportava sempre come se si fosse verificato nella seconda chiamata di funzione.

Direi che se si verifica questo errore, rimuovere eventuali gestori di eventi aggiuntivi che potrebbero essere attivati ​​e vedere se questo arresta il problema.