jQuery selector "memory"

Question

J'ai un formulaire avec plusieurs champs, et chaque fois que l'utilisateur modifie un champ le formulaire est soumis (via iframe caché), et la réponse est placée dans un div approprié sur la page via un rappel. La première fois cela fonctionne bien. Mais à chaque changement de champ et soumission subséquent, la réponse est montrée dans chaque div qui a été rempli avec une réponse (ainsi ils montrent tous la même chose, pas le comportement désiré).

Quelqu'un peut-il me dire pourquoi cela se produit? Il semble qu'il y ait une certaine rétention des sélecteurs qui ont été appelés avant (depuis le chargement de la dernière page) ... mais je ne suis pas sûr. Voici mon code:

$(function() 
{ 
    $('#ImageAddForm input').change(function(){ 
     form = $('#ImageAddForm'); 

     var fldDiv = $(this).parent().attr('id'); // eg Image11 
     var thDiv = fldDiv.replace('Image', 'Thumb'); // eg Thumb11 

     $(form).iframePostForm({ 
      post : function(){ 
       var msg = 'Uploading file...'; 
       $("#" + thDiv).html(msg); 
      }, 
      complete : function (response){ 
       $("#" + thDiv).html(response); 
       $(':input', '#ImageAddForm').not(':hidden').val(''); 
      } 
     }); 

     form.submit(); 
    }); 
}); 

Answer 1

Je ne suis pas au courant de ce plug-in, mais je soupçonne de ce qui pourrait être la cause de votre problème. Vous attachez des fonctionnalités à votre formulaire avec le plug-in à l'intérieur de votre événement de modification. Cela signifie qu'à chaque changement, vous vous attachez de nouveau, ce qui risque de causer quelques problèmes. Deux solutions se suggèrent:

1) Si le plug-in a une sorte d'appel pour se dissocier ou se détruire, appelez cela avant de lier le plug-in au formulaire. Cela devrait empêcher tout comportement étrange causé par la liaison multiple. 2) Meilleure solution: lier le plug-in au formulaire en dehors de votre événement change, et étendre vos variables (fldDiv, tdDiv) de telle sorte qu'elles soient accessibles à la fois à votre évènement de changement (afin qu'elles puissent être modifiées sur ce qui a changé) et les fonctions utilisées par le plug-in (pour post et complet). De cette façon, vous ne lierez le plug-in qu'une seule fois, mais vous pourrez toujours transmettre et recevoir différentes données en fonction du champ modifié.