Les événements de Backbone.js ne sont pas reconnus dans IE8

Question

J'ai des événements pour 'soumettre' sur un formulaire. Dans IE8, si je soumets le formulaire sans entrer aucune information, il suffit de cliquer sur le bouton soumettre, il publie le formulaire et il n'est jamais attrapé ou manipulé par l'événement défini dans Backbone. Cependant, si je clique simplement sur un champ de saisie, puis cliquez sur soumettre l'événement est géré.

L'événement fédérateur est configuré comme ceci:

events: { 

'submit #form': 'submitForm', 

     }, 
submitForm: function(e){ 
    e.preventDefault(); 
} 

Toutes les idées pourquoi ce serait?

Mise à jour: Voici un exemple de la forme:

<div id="form"> 
    <form action="/action" method="post"> 
    <input type="text" name="name" /> 
    <button type="submit" value="Submit"></button> 
    </form> 
</div> 

Il est littéralement seulement dans IE8 et seulement si vous ne cliquez d'abord sur un élément dans la forme, avant de le soumettre. L'événement est déclenché dans FF, Chrome, IE9 + sans problème. Mais seulement dans IE8, si vous cliquez simplement sur submit, sans rien faire d'autre, l'événement ne sera pas déclenché.

Answer 1

Je crois que le problème ici est qu'avant IE9, submit events don't bubble up the DOM. Dans votre exemple, vous enregistrez l'événement sur un div contenant le formulaire soumis. Vous devrez peut-être gérer spécifiquement l'événement submit du formulaire après le rendu au lieu de vous fier aux événements du backbone. Cependant, je ne sais pas pourquoi cela fonctionnerait si vous placez le curseur dans un élément du formulaire en premier, par contre.

Answer 2

Certains événements ne peuvent pas être délégués en utilisant cette méthode. "focus" et "flou" ne fonctionnent pas, et dans IE8 et "change" plus bas, "submit" et "reset" ne fonctionnent pas non plus. Il est en fait dans le annotated source of Backbone mais pour une raison quelconque pas dans the documentation.

La documentation de JQuery indique en fait que la méthode que Backbone utilise ($.delegate) est maintenant remplacée par $.on qui est capable de gérer ce genre d'événements.

Ainsi, vos options sont:

• Backbone.View.delegateEvents de surcharge à utiliser .on $ au lieu de .delegate
• $ lier manuellement les événements comme le montre EndangeredMassa.

Answer 3

Vous pouvez joindre les événement correctement avec .on $ pour IE8 après le rendu

utiliser cette fonction générique postRender:

fixIeBug = function(){ 
    if(!$.browser.msie || $.browser.version > 8){ 
     return; 
    } 

    var delegateEventSplitter = /^(\S+)\s*(.*)$/; 

    var events = this.events; 
    if($.isFunction(events)){ 
     events = events.apply(this);     
    } 

    var handleEvents = ['change', 'submit', 'reset', 'focus', 'blur'] 

    for (var key in events) { 
     var method = events[key]; 
     if (!_.isFunction(method)) method = this[events[key]]; 
     if (!method) throw new Error('Method "' + events[key] + '" does not exist'); 
     var match = key.match(delegateEventSplitter); 
     var eventName = match[1], selector = match[2]; 

     if(_.indexOf(handleEvents, eventName) == -1){ continue; } 

     method = _.bind(method, this); 
     if (selector === '') { 

     } else {     
      var self = this;      
      (function(eventName,method){ 
       //console.log('trying to set "on" handler for %s, key=%s', eventName, key); 
       self.$(selector).on(eventName, function(e){        
        //console.log('got it, eventName=%s', eventName);     
        return method(e); 
       }) 
      })(eventName,method); 
     } 
    }     
} 

Answer 4

Vous avez 'submit #form', mais notez que l'attribut id form est sur le contenant <div id="form">, pas le formulaire lui-même. Si vous utilisez simplement 'submit form' (saisissez un élément de formulaire dans votre el) ou si vous ajoutez un ID à l'attribut <form> et que vous le sélectionnez en conséquence, vous devriez obtenir le comportement attendu.

À moins, as noted, vous utilisez IE 9 <, dans ce cas, vous ne pouvez pas se lier à change, submit ou reset événements.